Question

我有很多带有'Thumbnails'类的div，其中包含5个像这样的图像

<div class='thumbnails'>

    <img src='image1.jpg' />
    <img src='image2.jpg' />
    <img src='image3.jpg' />
    <img src='image4.jpg' />
    <img src='image5.jpg' />

</div>

的CSS：

.thumbnails{ position:relative; }
.thumbnails img{ position:absolute; top:0px; left:0px; }

每张图片都有位置：绝对;所以默认情况下，image1位于顶部

我想做的是

当访问者在“缩略图”div上徘徊时，它会显示/切换每个图像“像滑块一样的东西”，在鼠标输出时它会返回到默认图像（image1），依此类推每个'缩略图'div

所有帮助将不胜感激

Answer 1

看起来你想要在调用使用.animate（）的函数的#thumbnails上绑定一个.mouseenter（）事件。然后该函数可以运行动画，然后运行完成（'#image'+ counter），然后再次运行该函数。（你也可以创建一个setInterval来实现它而不是完成）只需设置一个变量来检测.mouseleave（）以停止由.mouseenter（）启动的动画链

文档：

http://api.jquery.com/mouseenter/

http://api.jquery.com/mouseleave/

http://api.jquery.com/animate/

jquery在悬停时切换图像

1 个答案: