Question

我试图让div消失并重新出现，文本消失，div崩溃，然后与另一个div相反，使用JQuery动画功能但是在以下代码中没有工作：

$(currentTab + " > p").animate({ opacity: 0},{
        duration: 500,
        complete: function(){

            $(currentTab).animate({width: "0", opacity: 0}, {
                duration: 500,
                complete: function(){

                    $(clickedTab).animate({width: "70%"}, {duration: 500, complete: function(){

                        $(clickedTab + " > p").animate({
                            opacity: 1
                        }, 500);
                    }});

            }});

    }});

其中currentTab和clickedTab是我的div，比如＆＃34;＃ct-1＆＃34;，我的html看起来像这样：

<div id="ct-1" class="content-div">
    <p>aaaaaaaaaaaaaaaaaaaaaaaa</p>
</div>
<div id="ct-2" class="content-div">
    <p>bbbbbbbbbbbbbbbbbbbbbbbbb</p>
</div>

所以第二个动画根本不会运行。我猜这与DOM有关，也许我无法访问动画中的父级？也许它与它无关......

提前致谢！

罗宾

Answer 1

假设currentTab ct-1 且clickedTab ct-2 ，您的所有动画都在这个小提琴中工作：

<强> http://jsfiddle.net/3k0x3c4L/

除非clickedTab有背景，否则你不会注意到宽度缩小，我已经在小提琴中添加了背景。

JQuery宽度动画不会运行

1 个答案: