在他出现时移动阻止

Question

Here可以看到第一个块出现，然后改变它的边缘。

如何才能使这两个事件同时发生？

我试图同时运行这两个函数，但它不起作用：

$(document).ready(function(){

  $('#box1').fadeIn(2000); 
  $('#box1').animate({marginLeft: '100px'});  

}); // end ready

Answer 1

正如Felix Kling所述，为了使这些动画同时发生，您应该使用jQuery方法opacity使用.animate()为这些框设置动画。这样，你就可以制作一个动画而不是一个动画，然后是另一个动画。

$(document).ready(function(){
    //Hide these boxes not with display:none, but with opacity:0 and then change their opacity to 1.
    $('#box1').animate({marginLeft: '100px', opacity: '1'}, 2000);  
    $('#box2').animate({marginLeft: '100px', opacity: '1'}, 2000);  
}); // end ready

这是小提琴：http://jsfiddle.net/4BnG3/1/