0
Я использую Isotope на веб-сайте, который я создал - он используется для размещения большого количества JPEG-файлов, а также с фильтрующей системой - это хорошо работает, но загрузка страницы медленная, поскольку я думаю, что Isotope имеет некоторые проблемы с загрузкой много изображений ...Изображения с изотопной нагрузкой progessively
код я использую, как показано ниже:
$(window).load(function() {
// init Isotope
var $grid = $('.workGridWrapper').isotope({
// options
itemSelector: '.workGridItem',
percentPosition: true,
masonry: {
// use element for option
columnWidth: '.grid-sizer'
},
filter: '.InitialLoad'
});
// store filter for each group
var filters = {};
$('.filterGridInner').on('click', 'a', function() {
var $this = $(this);
// get group key
var $buttonGroup = $this.parents('.button-group');
var filterGroup = $buttonGroup.attr('data-filter-group');
// set filter for group
filters[ filterGroup ] = $this.attr('data-filter');
// combine filters
var filterValue = concatValues(filters);
// set filter for Isotope
$grid.isotope({ filter: filterValue });
});
// change is-checked class on buttons
$('.filterGridInner .button-group').each(function(i, buttonGroup) {
var $buttonGroup = $(buttonGroup);
$buttonGroup.on('click', 'li', function() {
$buttonGroup.find('.filterOn').removeClass('filterOn');
$(this).addClass('filterOn');
});
});
});
// flatten object by concatting values
function concatValues(obj) {
var value = '';
for (var prop in obj) {
value += obj[ prop ];
}
return value;
}
Я уверен, что функция window.load это вопрос ...
Я видел заметки об использовании imagesLoaded - но не знаете, как его использовать не испортив мое текущее решение.
Любые советы по загрузке страницы намного быстрее? Общий вес страницы составляет всего 2,1 МБ, что на 1,7 Мбайт, что на изображениях - но, как мне кажется, требуется 18 секунд для загрузки.
Любые идеи?
Проверить эту codepen, который использует как ImagesLoaded + изотопный плагин. Http: // codepen.io/desandro/pen/bsHix –
Спасибо. Я действительно хочу адаптировать то, что у меня есть, а не использовать другое решение. – dubbs