I'm making js-slider of div blocks. I have an arrows to the both sides. I want to scroll horizontally my slider when mouse is over. Before this I did everything using this code:
jQuery('.control')
.bind('click', function(){
jQuery('#slideInner').animate({
'marginLeft' : SlideWid开发者_高级运维th * SlideNumber
});
});
But what to do, if I want slide everything until mouse is over .control
?
You should have a setInterval(...)
to be delay-looping while element is hovered
var interval = null; // I use global var for this example - globals are discouraged in general
jQuery('.control')
.hover(function(){
interval = setInterval(function() { // start looping when mouse enters
jQuery('#slideInner').animate({
'marginLeft' : SlideWidth * SlideNumber
});
},
1000); // this is how many milliseconds you want to wait between animations
}, function(){
clearInterval(interval); // stop looping when mouse is out
});
Note: this is an oversimplification and requires further work (e.g. check for margin not to go out of bounds, etc), but it's intention is to show how setInterval(...)
could be applied for your problem.
精彩评论