jquery - 同位素问题 - 排序/过滤后始终将元素保留在左上角

Question

我使用同位素按名称或类别对元素进行过滤和排序，在主容器内按降序或升序排列。

我需要保持第一个元素静态，以便它不受排序/过滤的影响。我已经设法做到这一点，但为第一个元素工作，但是，当添加特定过滤器时，第一个元素被隐藏，所以我需要第二个元素(将显示为第一个)变为静态，所以我总是有左上角可见的静态元素。

以下代码适用于第一个元素。我尝试修改下面的代码以合并第二个元素，以便在应用排序时保持静态，但我很挣扎。有人可以帮忙吗？

            var $container = $('#container'),
                 filters = {};
                 $container.isotope({
                itemSelector: '.element',
                masonry: {
                    columnWidth: 260
                },
                getSortData: {
                    category: function($elem) {
                        if ($elem.is('.first_static')) {
                            return -1;
                        }
                        return $elem.attr('data-category');
                    },
                    date: function($elem) {
                        if ($elem.is('.first_static')) {
                            return -1;
                        }
                        return $elem.attr('data-expiry');
                    },
                    name: function($elem) {
                        if ($elem.is('.first_static')) {
                            return -1;
                        }
                        return $elem.find('.name').text();
                    },
                    first: function($elem) {
                        // sort by first_static first, then by original order
                        return ($elem.hasClass('first_static') ? -500 : 0) + $elem.index();
                    }
                },
                sortBy: 'first'
            });

我正在开发 JSFiddle ( http://jsfiddle.net/AbUgj/24/ ) 来演示我想做的事情

Answer 1

添加一个名为 show_el 的新类，然后尝试遵循此代码。

.show_el:first {
    display: static;
}