Sexy jQuery Hover Effects on Image - a-sexy
| File Size: | 666KB |
|---|---|
| Views Total: | 2339 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
a-sexy is an awesome and simple jQuery plugin for creating some sexy effects (pan, zoom, linear, etc) on your image when hovers over.
How to use it:
1. Load the jQuery javascript and jQuery a-sexy plugin on your web page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.asexy.min.js"></script>
2. Insert an images in your document.
<img src="images/demo.jpg" alt="Peach and Lime" />
3. Initialize the plugin with default options.
<script type="text/javascript">
$(document).ready(function(){
$('img').asexy();
});
</script>
4. All the options.
<script type="text/javascript">
$(document).ready(function(){
$('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>
This awesome jQuery plugin is developed by AntonShevchuk. For more Advanced Usages, please check the demo page or visit the official website.











