Scroll Image On Hover - jQuery scrollImageInside.js
| File Size: | 4.12 KB |
|---|---|
| Views Total: | 1898 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
scrollImageInside.js is a jQuery image scroller plugin that smoothly scrolls an image up and down based on the position of the mouse hovering over the image container.
How to use it:
1. Add jQuery library and the scrollImageInside.js script to the webpage.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/jquery.scrollimageinside.js"></script>
2. Call the function on the image container and done.
<div id="example"> <img src="1.jpg" alt="" /> </div>
$(function(){
$('#example').scrollimageinside();
});
3. Customize the scroll speed. Default: 250.
$('#example').scrollimageinside({
speed: 900
});
4. Customize the duration of the animation. Default: 15.
$('#example').scrollimageinside({
duration: 50
});
5. Apply an easing equation to the animation. Default: 'linear'.
$('#example').scrollimageinside({
easing: 'ease-in-out'
});
6. Set the height of the image. Default: 0 (image's height).
$('#example').scrollimageinside({
height: 0
});
This awesome jQuery plugin is developed by ashwebstudio. For more Advanced Usages, please check the demo page or visit the official website.











