jquery - jQuery/CSS3 无法让动画并行运行

Question

问题演示

http://jsfiddle.net/8yTY8/2/

解释

我试图让一个元素移动，并让一个 CSS 类在内部元素上运行一些动画。但是，如果我在外部元素上运行 jquery 动画之前应用该类，则该类将不起作用（它甚至不会移动到新位置，更不用说动画了）。

看看我的意思运行动画。然后注释掉$('#box .inner-box').addClass('animate')并取消注释它说“它在这里不起作用”的同一行。

这个是来做什么的？

这是用于我的自定义滑块，因此当幻灯片进入时，内容已经在动画化（这样看起来好多了）。

那么我怎样才能让它们并行运行呢？谢谢。

Answer 1

根据您的示例，您没有使用相同的选择器。这对我有用：

$(document).ready(function() {
    $('#box .inner-box').addClass('animate');  // it doesn't work here!
    $('#box').animate({top:'150px'}, 2000, 'swing', function() {
        //$('#box .inner-box').addClass('animate');
    });        
});

请注意我必须如何更改第一行（它在这里不起作用！）以添加.inner-box到选择器，就像您在动画完成函数中所做的那样。

那是你想要做的吗？它似乎对我来说是并行动画。

http://jsfiddle.net/8yTY8/3/