2011-08-05 45 views
8

我要做到以下几点:衰落多个元素simutaneously - jQuery的

$(newPanel, prevBtn, nextBtn, infoPanel).fadeIn(200, function() { 
} 

这些增值经销商和jQuery创建的div

,但只有第一个元素淡入,我真的需要的所有元素淡入与此同时。任何想法?

回答

22

可以使用add的方法得到相同的jQuery对象中的元素:

newPanel.add(prevBtn).add(nextBtn).add(infoPanel).fadeIn(200); 
+0

啊,这很好。下次会尝试。 – inquam

+0

@Guffa我加了一个回调函数,回调函数执行了四次。这是正常的任何分组? – Wesley

+1

@Wesley:由于jQuery对象中有四个元素,每个动画都有自己的回调函数。从文档:“如果多个元素是动画的,重要的是要注意,回调是每个匹配元素执行一次,而不是整个动画一次。” http://api.jquery.com/fadeIn/ – Guffa

1

假设newPanel等等都是这样创建的变量:

newPanel = $("#newPanel"); 

只是写:

newPanel.fadeIn(200); 
prevBtn.fadeIn(200); 
nextBtn.fadeIn(200); 
infoPanel.fadeIn(200); 
0
$.each([newPanel, prevBtn, nextBtn, infoPanel], function(i, el) { 
    $(el).fadeIn(200); 
}); 

更新:
如果你想调用的函数只有一次,你可以通过添加元素来做点什么like @Guffa did同样的jQuery的收集,然后才申请动画(一次):

[newPanel, prevBtn, nextBtn, infoPanel] 
    .reduce(function(el, next) { 
     return el.add(next); 
    }) 
    .fadeIn(200); 
+0

这会不会是一样的做他们一次一个? – 472084

0

它要么使用$.each做或者我会建议你将他们按类或ID分组,然后使用它们淡入淡出。

例如,您可以在组类中的所有相关的元素,然后做这些类,而不是每一个元素的$.each电话。

+0

如果我添加一个回调函数,将为每个有类的元素执行?我只想要一次回调。 @inquam – Wesley

+1

你的意思是,如果你有一个回调时,在动画完成调用它会为使用类或曾经使用类的每一个元素元素的整个集合触发一次?我其实并不知道。我猜想它会为每个元素触发一次,因为我认为它会附加到每个元素上。如果回调已被调用一次,可以通过添加一个检查来克服。类似于“if(!firsttime)return;'。也许不是世界上最漂亮的东西,但它会起作用。 – inquam