2

我目前负责这个插图网站，该网站有一个图片库，直到最近它都运行良好。它有一个流畅的 slideUp slideDown 动画，每个人都很高兴。然后突然之间，这种平滑不再起作用，图像现在到处乱晃。也许这与最近的 JQuery 更新有关，或者我的代码中可能存在明显错误？

这是此处图片库的 JQuery：

(function() {
    var nav = $('.nav div');
    var images = $('.images li');
    var imagebutton = $('.images li:not(:last) > img');
    $('.images li:first-child').slideDown(500);
    nav.click(function() {
        var imageno = nav.index(this);
        images.slideUp(500);
        images.eq(imageno).slideDown(500);
        return false;
    });
    imagebutton.click(function() {
        $(this).parent(images).slideUp(500).next().slideDown(500);
        return false;
    });
})();​

您可以在此处查看实时示例：

http://www.gloryillustration.com/tests/nodland.html

4

2 回答 2

3

因为slideUpandslideDown方法是异步的，一旦你调用一个，下一行代码就会被执行……也就是说，一旦你向上滑动，你现在在动画完成之前就向下滑动了。但是，这些方法中的每一个都有一个回调，一旦动画完成就会调用它。尝试类似：

$('#el').slideUp(500, function() { $('#el2').slideDown(500); });

slideUp 中的第二个参数将在 500 毫秒动画后调用。

于 2012-10-23T19:31:22.067 回答
0

如果您重复选择相同的图像，我会延迟并修复跳转。

if ($(this).parent() != $(this).next().parent())
{
    $(this).parent(images).slideUp(500).next().delay(500).slideDown(500);
}
于 2012-10-23T19:48:48.547 回答