在页面加载时应用同位素数据过滤器

时间:2015-11-07 12:54:31

标签: wordpress isotope

我有一个WordPress插件,它使用同位素数据过滤器对菜单项进行排序,但在页面加载时,项目不会被分类。我将以下函数添加到我的functions.php中:

// Scala 2.11.7
def distinct: Repr = {
  val b = newBuilder
  val seen = mutable.HashSet[A]()
  for (x <- this) {
    if (!seen(x)) {
      b += x
      seen += x
    }
  }
  b.result()
}

它完成了这项工作,但它很难看,因为它是在项目最初显示后执行的。我在这里阅读了有关类似问题的其他帖子,但我无法让解决方案适用于我的特定模板。

Demo page

1 个答案:

答案 0 :(得分:0)

您是否尝试使用通配符过滤器来获取所有项目?

<a href="#" data-filter="*" class="menu-filter-link">Alle anzeigen</a>

编辑:好的我觉得你不需要第一个菜单上的所有项目。所以这是一个jsfiddle显示你需要的确切内容。

编辑:只需在文件末尾替换此代码

(function($){
    $(window).load(function() {
        $('a[data-filter=".sparmenue"]').trigger('click');
    });
})(jQuery);

有了这个

$(function(){

  var $container = $('#grid-wrap'),
      $filterLinks = $('#menu-filters a');

  $container.isotope({
    itemSelector: '.isotope-item',
    filter: '.sparmenue'
  });

  $filterLinks.click(function(){
    var $this = $(this);

    // don't proceed if already selected
    if ( $this.hasClass('selected') ) {
      return;
    }

    $filterLinks.filter('.selected').removeClass('selected');
    $this.addClass('selected');

    // get selector from data-filter attribute
    selector = $this.data('filter');

    $container.isotope({
      filter: selector
    });


  });

});

如果需要,还可以在menu-filter-link旁边添加所选类,以突出显示所选类别。