悬停时翻转整个图像，动画速度不规则
|
上下文：我有一个图像块，它们绝对位于彼此的顶部。在鼠标悬停时，通过添加css类将图像移动到堆的顶部，一个接一个地显示图像。当到达最后一张图像时，将显示第一张图像，并且一直持续到鼠标移出为止。
参考：这是一个参考站点，可以看到类似的效果。 （将鼠标悬停在图像块上）。
HTML：
<div id=\"flicker\">
<img src=\"example1.gif\" />
<img src=\"example2.gif\" />
<img src=\"example3.gif\" />
</div>
var flickerImg = jQuery(\'#flicker img\');
jQuery(\'#flicker\').hover(
function() {
flicker = setInterval(function() {
if (flickerImg.last().hasClass(\'active\')) {
flickerImg.removeClass(\'active\').first().addClass(\'active\');
}
else {
jQuery(\'#flicker img.active\').removeClass(\'active\')
.next().addClass(\'active\');
}
}, 100);
},
function() {
clearInterval(flicker);
});
没有找到相关结果
已邀请:
1 个回复
秃拳割