0
我創建一個投資組合網站展示我的作品。我正在使用Light Gallery在我的網站上顯示圖片和視頻。我想通過使用Isotope.js添加篩選選項同位素過濾不起作用的錨標記
我無法弄清楚我的代碼有什麼問題。 我已經安裝了一支筆CodePen
請隨時添加到代碼。
// external js: isotope.pkgd.js
// init Isotope
var $grid = $('.nlg1').isotope({
itemSelector: '.revGallery-anchor',
layoutMode: 'fitRows'
});
// filter functions
var filterFns = {
// show if number is greater than 50
numberGreaterThan50: function() {
var number = $(this).find('.number').text();
return parseInt(number, 10) > 50;
},
// show if name ends with -ium
ium: function() {
var name = $(this).find('.name').text();
return name.match(/ium$/);
}
};
// bind filter button click
$('.filters-button-group').on('click', 'button', function() {
var filterValue = $(this).attr('data-filter');
// use filterFn if matches value
filterValue = filterFns[ filterValue ] || filterValue;
$grid.isotope({ filter: filterValue });
});
// change is-checked class on buttons
$('.button-group').each(function(i, buttonGroup) {
var $buttonGroup = $(buttonGroup);
$buttonGroup.on('click', 'button', function() {
$buttonGroup.find('.is-checked').removeClass('is-checked');
$(this).addClass('is-checked');
});
});
感謝
嗨Micheal, 我已經在codepen和我的項目中做了這些改變。但它不在我的項目中工作。還應該添加其他內容。論壇中有人向我介紹了imageloaded.js。我應該使用它 – Kamalakannan
@Kamalakannan當我在codepen中進行過濾時,過濾工作正常。你說這在codepen中不起作用?怎麼了? –
不,我說它不在我的本地主機項目中工作。 Codepen它的工作.. – Kamalakannan