Image slide start on mouse hover jquery
<script type="text/javascript" src="js/cycle.js"></script> // Download cycle.js from here http://jquery.malsup.com/cycle/
<script type="text/javascript">
jQuery(function($){
// Cycle plugin
$('.slides').cycle({
fx: 'none',
speed: 1000,
pager: '#nav',
timeout: 70
}).cycle("pause");
// Pause & play on hover
$('.slideshow-block').hover(function(){
$(this).find('.slides').addClass('active').cycle('resume');
}, function(){
$(this).find('.slides').removeClass('active').cycle('pause').cycle(0);
});
});
</script>
<div class="product-img slideshow-block">
<div class="slides">
<img src="http://yoursite.com/slide1.jpg" />
<img src="http://yoursite.com/slide2.jpg" />
<img src="http://yoursite.com/slide3.jpg" />
</div>
</div>
