Question

我对jquery很新，所以如果我的问题太基础，请提前原谅我。我有一些悬停幻灯片效果的问题，似乎是CSS和jquery问题的混合。当我将鼠标悬停在图像上时，第一次完全滑动到图像的末尾，但似乎悬停效果仅在第二次从第一个元素下方滑动一半，而不是从图像滑动开始结束了。

我为此尝试了很多其他可能性，但到目前为止没有运气，如果有人能指出我正确的方向，我将非常感激:)

我想要实现的一个例子可以在这里找到

http://jsfiddle.net/robolist/rK4GD/

$('.proimg').hover(function(event) {
      $('.boxcaption',this).stop().toggle( 'slide' );
}).on('mouseleave',function(event) {
      $('.boxcaption',this).stop().toggle( 'slide' )});

非常感谢提前

Answer 1

当您在悬停时使用切换时，您不需要执行mouseleave事件。另请注意，stop采用布尔参数，首先是清除队列，第二个是跳转到结束：

只是做：

$('.proimg').hover(function(event) {
    $('.boxcaption',this).stop(true, true).toggle( 'slide' );
});

小提琴：http://jsfiddle.net/rK4GD/10/

请参阅：http://api.jquery.com/stop/

Jquery切换（'slide'）只滑动一次

1 个答案: