如何使用相同的類jQuery

Question

您必須看到效果才能知道我的意思。

http://jsfiddle.net/VS8tQ/28

我不能使用jQuery中同一類，因爲我無法達到預期的效果，所以我有2班製作動畫。

任何人都可以告訴我如何使用一個類來實現相同的效果嗎？

Answer 1

我想你會需要爲這個嵌套循環：

$(".section").each(function() { 
    $(this).children().each(function(i) { 
    }); 
}); 

http://jsfiddle.net/VS8tQ/29/

Answer 2

試試這個：http://jsfiddle.net/VS8tQ/30/

$("p").animate({opacity: 0}, 0); 


$(".divSection1 *").each(function(i) { 
    taDa(this, i) 
}); 

$(".divSection2 *").each(function(i) { 
    taDa(this, i) 
}); 

function taDa(obj, i) { 
    $(obj) 
     .delay(100 * i) 
     .css('display', 'block') 
     .animate({opacity: 0}, 0)  
     .animate({opacity: 1, marginLeft: "+=10px"}, 200); 
} 

Answer 3

我想這就是你要尋找的解決方案（ jsFiddle）：

$("p").animate({opacity: 0}, 0); 

$(".divSection").each(function() { 
    $(this).children().each(function(i) { 
     $(this).delay(100 * i).css('display', 'block').animate({ 
      opacity: 0 
     }, 0).animate({ 
      opacity: 1, 
      marginLeft: "+=10px" 
     }, 200) 
    }); 
}); 

Answer 4

你的代碼是絕對正確的，不需要寫兩遍。只需使用jQuery的匹配如下類名'section'：

$("p").animate({opacity: 0}, 0);  
$("div[class^='section']").each(function() { 
    $(this).children().each(function(i) { 
     $(this) 
      .delay(100 * i) 
      .css('display', 'block') 
      .animate({opacity: 0}, 0)  
      .animate({opacity: 1, marginLeft: "+=10px"}, 200) 
    }); 
}); 

"div[class^='section']"選擇與「部分」（如SECTION1，第2節..）開頭的所有類。