This plugin allows you to create sexy hover effect for images on your page ;)

Requried:

• jQuery 1.3+

Test with following browsers:

• Opera 10.0+
• Mozilla Firefox 3.0+
• Google Chrome 3.0.195
• Safari 3.1+ (win)
• Internet Explorer 8.0

Go to:

• Download
• Installation
• Options
• Demo

Web Access:

http://code.google.com/p/a-sexy/downloads/list
http://plugins.jquery.com/project/a-sexy

SVN Command-Line Access:

svn checkout http://a-sexy.googlecode.com/svn/trunk/ a-slideshow-read-only

[Top]

Include JavaScript library jQuery and (a)Sexy Images plugin:

<script type="text/javascript" src="/js/jquery.js?ver=1.3.2"></script>
<script type="text/javascript" src="/js/jquery.asexy.js"></script>
    

Create any content with images:

<div id="images">
        <img src="docs/images/Peach_and_Lime.jpg" alt="Peach and Lime" />
        <img src="docs/images/Rock_Chick.jpg" alt="Rock Chick" />
        <img src="docs/images/Angel.jpg" alt="Angel" />
        <img src="docs/images/More_stripes.jpg" alt="More stripes" />
</div>
    

Initialize plugin:

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
    $('#images img').asexy();
});
//]]>
</script>
    

Result:
[Top]

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
    $('selector img').sexy({
        width:320,
        height:240,
        left:0,       // can be 'center'
        top:0,        // can be 'center'
        zoom:true,    // zoom to size
        speed:500,    // only in ms
        opacity:0.8,  // from 0.0 to 1.0
        round:60,     // don't start new iterration for small different (for linear and zigzag functions)
        func:"linear" // available linear, zigzag, vertical, horizontal, x  
    });
});
//]]>
</script>

[Top]

• Default configuration
• Custom configuration
• Many on one page

[Top]

Thank to Dominic-Marco for really sexy images

Author Homepage: http://anton.shevchuk.name

代码整理：时代Java（NowJava.com）　更多相关效果，请到脚 本之家 脚本下载栏目

注：此代码仅供学习交流，请勿用于商业用途。

时代Java（NowJava.com）素材中心整理。