我在我的网站上使用jQuery Isotope来加载图像墙。我的工作正常,但我想添加一些额外的东西,但我在他们的网站上找不到任何东西来做...
当浏览器窗口调整大小时,我希望它在重新排序图像时显示。
可以这样做吗?
这是我到目前为止所做的:
(function($) {
$(document).ready(function() {
var $container = $('#isotope-container');
$container.isotope({
itemSelector: '.isotope-element',
sortBy : 'random' // THIS IS NOT WORKING TO SORT
});
var $optionSets = $('#isotope-options .option-set'),
$optionLinks = $optionSets.find('a');
$optionLinks.click(function(){
var $this = $(this);
// don't proceed if already selected
if ( $this.hasClass('selected') ) {
return false;
}
var $optionSet = $this.parents('.option-set');
$optionSet.find('.selected').removeClass('selected');
$this.addClass('selected');
var options = {},
key = $optionSet.attr('data-option-key'),
value = $this.attr('data-option-value');
// parse 'false' as false boolean
value = value === 'false' ? false : value;
options[ key ] = value;
if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
// changes in layout modes need extra logic
changeLayoutMode( $this, options )
} else {
// otherwise, apply new options
$container.isotope( options );
}
return false;
});
$('.isotope-element img').each(function(){
var $this = $(this);
setTimeout(function(){
$this.fadeIn(Math.floor(Math.random()*1500));
}, Math.floor(Math.random()*1500));
}
);
});
})(jQuery);
非常感谢任何帮助。
由于 ç
答案 0 :(得分:2)
对不起,我对此进行了一些调查,实际上这次测试了:) 试试这个:
$(window).resize(function() {
$container.isotope( 'shuffle', function() {});
});
答案 1 :(得分:0)
例如,如果您想通过按钮进行随机播放,则可以使用此更简单的代码
$('.shuffle-button').on( 'click', function() {
$grid.isotope('shuffle');
});