通過元素

Question

循環

嗨，我想打在有階級的「.block儲液標籤」的所有元素的功能循環，並做到以下幾點：

$(function(){ 

function cssTabs(){ 

var firstTab = $(".block-header-tabs").find("a:first"); 
var firstBlock = $(".block-header-tabs").find("a:first").attr('href'); 
$(firstBlock).parent().css({position: "relative"}); 
$(firstBlock).css({position: "absolute", zIndex: "2"}) 
$(firstBlock).siblings().css({opacity: "0", position: "absolute", top: "0", zIndex: "1"}); 
$(firstTab).addClass("tab-current"); 
$(firstTab).siblings().addClass("tab-noncurrent"); 

} 

cssTabs(); 

$(".block-header-tabs a").click(function(){ 
    $(this).siblings().removeClass("tab-current").addClass("tab-noncurrent"); 
    $(this).removeClass("tab-noncurrent").addClass("tab-current") 
    var clickedTab = $(this).attr('href'); 
    $(clickedTab).siblings().css({zIndex: "1"}).stop(0,0).animate({opacity:"0"}, function(){ 
     $(clickedTab).siblings().css({display:"none"}); 
    }); 
    $(clickedTab).css({display:"block", zIndex:"2"}).stop(0,0).animate({opacity:"1"}); 

    return false; 

}); 

}); 

這裏是生活的鏈接例如，所以你可以檢查出來自己:) http://dl.dropbox.com/u/2878602/moviezet/index.html

感謝

Answer 1

嘿，我自己解決了這個問題，事實證明，我不能使用a：首先定位主塊，如果我想在它上面使用.each（）。 :)這裏是固定的代碼，如果有人有興趣：

$(".block-header-tabs").each(function(){ 
    $($(this).find("a:first").attr('href')).css({position: "absolute", zIndex: "2"}) 
    $($(this).find("a:first").attr('href')).siblings().css({opacity: "0", position: "absolute", top: "0", zIndex: "1"}); 
    $($(this).find("a:first").attr('href')).parent().css({position: "relative"}); 
}); 

感謝：d

Answer 2

嘗試這個

$(function(){ 
    function cssTabs($this){ 
    var firstTab = $this(".block-header-tabs").find("a:first"); 
    var firstBlock = $this(".block-header-tabs").find("a:first").attr('href'); 
    $(firstBlock).parent().css({position: "relative"}); 
    $(firstBlock).css({position: "absolute", zIndex: "2"}) 
    $(firstBlock).siblings().css({opacity: "0", position: "absolute", top: "0", zIndex: "1"}); 
    $(firstTab).addClass("tab-current"); 
    $(firstTab).siblings().addClass("tab-noncurrent"); 
    } 

    $('.block-header-tabs').each(function(index) { 
    cssTabs($(this)); 
    $(this).find("a").click(function(){ 
     $(this).siblings().removeClass("tab-current").addClass("tab-noncurrent"); 
     $(this).removeClass("tab-noncurrent").addClass("tab-current") 
     var clickedTab = $(this).attr('href'); 
     $(clickedTab).siblings().css({zIndex: "1"}).stop(0,0).animate({opacity:"0"}, function(){ 
      $(clickedTab).siblings().css({display:"none"}); 
     }); 
     $(clickedTab).css({display:"block", zIndex:"2"}).stop(0,0).animate({opacity:"1"}); 
     return false; 
    }); 
    }); 
}); 

Answer 3

function cssTabs(element){ 
    var firstTab = element.find("a:first"); 
    var firstBlock = element.find("a:first").attr('href'); 
    $(firstBlock).parent().css({position: "relative"}); 
    $(firstBlock).css({position: "absolute", zIndex: "2"}) 
    $(firstBlock).siblings().css({opacity: "0", position: "absolute", top: "0", zIndex: "1"}); 
    $(firstTab).addClass("tab-current"); 
    $(firstTab).siblings().addClass("tab-noncurrent"); 
} 



$(function(){ 
    $.each($('.block-header-tabs'), function(i, el){ 
     cssTabs($(this)); 
     $(this).find('a').click(function(){ 
      $(this).siblings().removeClass("tab-current").addClass("tab-noncurrent"); 
      $(this).removeClass("tab-noncurrent").addClass("tab-current"); 
      var clickedTab = $(this).attr('href'); 
      $(clickedTab).siblings().css({ 
       zIndex: "1" 
      }).stop(0,0).animate({ 
       opacity:"0" 
      }, function(){ 
       $(clickedTab).siblings().css({display:"none"}); 
      }); 
      $(clickedTab).css({display:"block", zIndex:"2"}).stop(0,0).animate({opacity:"1"}); 
      return false; 
     })  
    }); 
});