Question

我的问题与jQuery Isotope queue shuffle/randomize animation基本相同 ...我试图让我的同位素过滤内容使用setInterval以设定的间隔随机重新排列。

完整的同位素代码如下。最后，我引用了随机播放按钮，以便在悬停时进行随机播放。无论用户互动如何，我都想开始玩游戏。如何调整此项以实现定时随机播放？

<script type="text/javascript">

 // init Isotope
 var $grid = $('.grid').isotope({
 itemSelector: '.element-item',
 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');
});
});

//shuffle on hover
$('.shuffle-button').hover(function() {
$grid.isotope('shuffle');
});
</script>

Answer 1

替换悬停功能

$('.shuffle-button').hover(function() {
$grid.isotope('shuffle');
});

用这个

setInterval(function() {
$grid.isotope('shuffle');
 }, 2000);

2000 = 2秒，使用您喜欢的任何间隔

jQuery Isotope定时洗牌

1 个答案: