Question

有人可以对这个片段有所了解。

我正在尝试将jQuery Masonry插件与过滤集成。由于某种原因，函数的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技能，但是如何测试输出或解决这个问题的任何帮助都会非常感激。

以下是过滤的HTML

   <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>

我也尝试为包装器元素指定宽度，但它没有帮助。

Answer 1

我已经汇总了一个工作淡入淡出的快速示例.FadeOut根据您提供的代码松散地切换。使用你发布的html / javascript，我并不是100％确定最终目标是什么，但是，希望这会让你在切换时朝着正确的方向前进：

jQuery fadeIn / fadeOut demo

jQuery FadeOut（）不起作用。点击然后跳转

1 个答案: