jQuery FadeOut（）不起作用。點擊只是跳躍而不是

有人可以在這個片段上點亮一些。jQuery FadeOut（）不起作用。點擊只是跳躍而不是

我正在嘗試將jQuery Masonry Plugin與過濾功能集成在一起。出於某種原因，函數的FadeIn部分適用於所有級別，但fadeOut（）不適用。

下面是代碼：

$j('#filter a').click(function(){ 
        var colorClass = '.' + $j(this).attr('class'); 
        //if($j('.portfolio').hasClass(colorClass){ 

        if(colorClass=='.box') { 
        // show all hidden boxes 
        $j('.portfolio').children('.invis') 
         .toggleClass('invis').fadeIn('slow'); 
        } else { 
        // hide visible boxes 
        $j('.portfolio').children().not(colorClass).not('.invis') 
         .toggleClass('invis').fadeOut('slow','linear'); 
        // show hidden boxes 
        $j('.portfolio').children(colorClass+'.invis') 
         .toggleClass('invis').fadeIn('slow', 'linear'); 
        } 
}

我仍然在我的js和jQuery的技能提高，但對如何測試輸出或解決這一問題的任何幫助，將不勝感激。

下面是過濾

<div id="filter"> 
<ul> 
    <?php 
    $taxonomy = 'portfolio-box-sets'; 
    $terms = get_terms($taxonomy, 'hierarchical=0'); 
     echo '<li><a class=".fbox">All</a></li>'; 
     if ($terms) { 
      foreach($terms as $term) { 
      echo '<li><a class="'.$term->name.'">' . $term->name . '</a></li>'; 
      } 
     } 
    ?> 
</ul></div>

我也試着指定寬度的包裝元素，但它並沒有幫助的HTML。

來源

2011-05-03 Adam Munns

看來，當工作點擊功能仍然在else語句中，但是隨時顯示所有框，然後隱藏未選中的框不起作用。希望有所幫助。 – 2011-05-03 22:34:09

我想你應該發佈一些部分的HTML代碼。你爲什麼需要一個'invis'類？你不能檢查隱藏狀態嗎？ – morgar 2011-05-03 23:12:05

我添加了鏈接到點擊功能的HTML。希望有所幫助。 – 2011-05-03 23:52:55

我已經放在一起工作淡入的一個快速示例淡入淡出根據您提供的代碼鬆散地切換。與HTML/JavaScript的你張貼，我不是100％確定什麼最終目標是，但是，希望這將讓你在正確的方向與切換：

jQuery fadeIn/fadeOut demo

來源

2011-05-04 03:39:28 ryanmarc

謝謝你的嘗試，但只是隱藏它們，而按鈕不能使它們恢復原狀。 – 2011-05-05 22:12:22

在我發佈的jsfiddle中的例子在這種情況下工作，但是，它可能需要適應您的情況。這並不意味着是一個直接的複製/粘貼解決方案。有一件事我會建議，與您的代碼的當前狀態粘貼在您的問題，更改toggleClass爲addClass或removeClass在適當的位置。 – ryanmarc 2011-05-06 02:29:08

jQuery FadeOut（）不起作用。點擊只是跳躍而不是

回答

相關問題