我在Stack Overflow上检查了很多主题,但是我没有成功地从其他页面选择过滤器选项。
我做了一个jsfiddle https://jsfiddle.net/f0Ld07mv/2/
我的同位素脚本
$(function(){
var $container = $('#plaquettes_container'),
filters = {};
$container.isotope({
itemSelector : '.plaquette_container',
transitionDuration: 0,
});
// filter buttons
$('select').change(function(){
var $this = $(this);
// store filter value in object
// i.e. filters.color = 'red'
var group = $this.attr('data-filter-group');
filters[ group ] = $this.find(':selected').attr('data-filter-value');
// console.log( $this.find(':selected') )
// convert object into array
var isoFilters = [];
for ( var prop in filters ) {
isoFilters.push( filters[ prop ] )
}
console.log(filters);
var selector = isoFilters.join('');
$container.isotope({ filter: selector });
return false;
});
$('section_plaquettes ul>li').click(function() {
var $this = $(this);
var group = $this.parent().data('filter-group');
filters[ group ] = $this.data('filter-value');
var isoFilters = [];
for ( var prop in filters ) {
isoFilters.push( filters[ prop ] )
}
console.log(filters);
var selector = isoFilters.join('');
$container.isotope({ filter: selector });
return false;
});
});
我不知道如何在我的2下拉菜单中使用URL哈希:我在官方网站上发现了很多东西:http://codepen.io/desandro/pen/vErxX http://isotope.metafizzy.co/filtering.html
但是当我尝试适应我的同位素过滤器时,我不会成功,如果你们能帮助我,谢谢你!