同位素:选择并在顶部显示.xx类

Isotope: Select and display .xx class at the top

本文关键字:显示 xx 顶部 选择 同位素      更新时间:2023-09-26

我正在使用同位素中的排序方法(http://isotope.metafizzy.co/docs/sorting.html)并且当点击链接时,需要在顶部显示指定了特定CSS类名的元素。剩下的元素必须在排序的元素下面保持可见,所以我不能使用同位素过滤。

我对JS/jQuery不太满意,所以我甚至不确定这段代码是否设置正确,但目前我的元素是按日期排序的,这很好,但它对所有元素都这样做。我希望我的代码能找到类名为"博客"的所有元素,然后按日期排列。这是我迄今为止的代码:

    getSortData : {
      blogs : function( $elem ) {
        return $elem.attr('.blogs'), $elem.find('.date').text();
      }
    }

同位素根据您提供的函数的返回值进行正常排序。

因此,您需要返回一些将.blog元素放在顶部的内容。。

我假设到目前为止,只有您使用了$elem.find('.date').text()

因此,为了改变这一点,您可以在开头添加一个空间,用于.blog 元素

尝试

getSortData : {
  blogs : function( $elem ) {
    var isBlog = $elem.hasClass('blogs');
    return (isBlog?' ':'') + $elem.find('.date').text();
  }
}

评论更新

    sortBy: 'initial',
    sortAscending : false,
    itemSelector: '.module',
    getSortData: {
        initial: function($elem) {
            return $elem.find('.date').text();
        },
        blogs: function($elem) {
            var isBlog = $elem.hasClass('blogs');
            return (isBlog ? '9' : '') + $elem.find('.date').text();
        },