将鼠标悬停在图像上时会出现javascript延迟

Question

我在页面上有四个图像，当我将鼠标悬停在图像上时，我想要一个水平div在条上移动，当鼠标指针离开图像时，我希望它向下滑动。现在，当我这样做时工作正常，但似乎有一个延迟。此外，如果我反复来回移动，延迟会更多，滑块会自动上下移动几秒钟。这是代码，请帮忙！

$('.indexgall').on('mouseenter',function()
{
    $(this).addClass('hoverimg');

    $(this).children().animate(
    {
        top: 150
    }, 600, function()
    {

    });
});

$('li').on('mouseleave',function()
{
    $(this).removeClass('hoverimg');

    $(this).children().animate(
    {
        top:250,
    }, 600, function()
    {

    });
});

Answer 1

从您的代码中看，它看起来不应该有延迟。你可以发布一个JSFiddle来显示这个问题吗？

要解决后一个问题，您希望使用JQuery stop()方法通过清理动画队列来停止动画。

这可以这样做：

$(this).stop().animate({
    width: 240
}, 500);

查看this JSFiddle。