使用setInterval在onMouseover上连续进行动画处理 [英] Animate continuously onMouseover using setInterval

问题描述

我已经在这个问题上停留了很长时间了，我已经在Google上搜索了无数小时，以提出解决方案，但无济于事.

I have been stuck with this problem for quite some time now and i have searched on Google for countless hours to come up with a solution but to no avail.

这是我的问题

我想了解轮播背后的逻辑，并希望在用户将鼠标悬停在相应按钮上时使其从右向左滑动，反之亦然.

I want to know the Logic behind a Carousel and would like to make it slide from right to left or vice-versa when a user hovers on the respective buttons.

如何在mouseenter上连续对其进行动画处理?

How can i make it animate continuously on mouseenter?

任何帮助将不胜感激.谢谢:)

Any help would be deeply appreciated. Thank You :)

这是JSFIDDLE: http://jsfiddle.net/neoragex/qXseV/

推荐答案

我已经更新了您的版本，请查看:)

I have updated your version, check it out :) http://jsfiddle.net/qXseV/2/

我所做的是将以下内容添加到您的.mid类的CSS中:

What I did is add the following to your css of the .mid class:

position:absolute;
top:20px;

我将您的setInterval更改为:

And I changed your setInterval to:

timer = setInterval(function() {slide();}, 400);

带有左右移动的额外jsfiddle http://jsfiddle.net/qXseV/7/

extra jsfiddle with both left and right movement http://jsfiddle.net/qXseV/7/

这篇关于使用setInterval在onMouseover上连续进行动画处理的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！