Question

我使用.animate（）在通过.show（“slow”）显示后可以平滑地重新定位几个div。由于div可能会或可能不会动画，我也使用.queue（）来确保在动画完成后进行移动。

问题：.animate（）不起作用。它到达正确的代码行，但不做任何事情，也不会产生任何错误。帮助

使用Javascript：

function arrange_sections() {
        var margin = 20;
        var left = margin;
        $(".section.active").queue(function() {
            $(".section.active").each(function() {
                $(this).animate({ "left": left }, "slow");
                left += $(this).width() + margin;
            });
        });
}

CSS：
（我使用show（“slow”）来显示不显示的部分：none）

.section {
    display: none;
    position: absolute;
    top: 5%;
    left: 5%;
    padding: 20px;
    z-index: 20;
}

Answer 1

我最好的猜测：你需要一种“位置：相对”的风格。或“位置：绝对;”添加到您的CSS。

我试图运行代码，但什么都没看到。但是，当我使用Firebug的HTML选项卡查看页面时，我看到他们中的大多数都有一个style =“left：140px”或类似的。

Answer 2

大卫所说的关于定位的+1。您的部分应该绝对位于相对定位的div内。另外，我认为你不需要jQuery / Queue方法。试试这个：

$(".section.active").each(function() {
    $(this).show("slow", function() {
    $(this).animate({ "left": left }, "slow");
    left += $(this).width() + margin;
    });                
});

这会导致在显示缓慢后调用左边的动画。我不知道你是如何处理这个节目的，但是当我在一个单独的函数中使用相同的模式并且然后一个接一个地调用时，在第二个队列函数内部根本没有调用animate函数。

根据我在jQuery docs中读到的内容，看起来所有动画功能都会自动添加到内置的fx队列中。

Answer 3

终于找到了答案 - 我需要做的就是在传递给queue（）的函数末尾包含dequeue（）函数。

感谢您的帮助，伙计们！

jQuery的.animate（）问题

3 个答案: