我正在使用Isotope jquery插件按名称或日期对列表中的多个文件进行排序。同位素函数运行完美,但我需要在排序后运行回调函数,我无法确定触发它的位置。
到目前为止,这是我的同位素代码:
function animationFinished() {
$('#isotope-container a').each(function(index, element) {
var top = parseInt($(element).css('top')); console.log(top);
});
}
var $container = $('#isotope-container').isotope({
getSortData: {
name: '[title]',
date: function( itemElem ) { // function
var date = $( itemElem ).attr('year');
return parseInt(date);
}
}
});
$('#sorting').change( function() {
//console.log('click');
var sortByValue = $(this).find('option:selected').attr('data-sort-by');
$container.isotope({ sortBy: sortByValue });
});
以下是正在排序的html的一个小例子
<div id="sorts" class="button-group">
<p>Sort by:
<select id="sorting">
<option data-sort-by="name">Name</option>
<option data-sort-by="date">Date</option>
</select></p>
</div>
<div id="isotope-container">
<a title="Army Corps of Engineers" year="2009" href="/army-corp-of-engineers-tom-river-rehab-nj-2009/">Army Corp of Engineers</a>
<a year="1999" title="Bolted Steel NSF Tank A6 & A7" href="/bolted-steel-nsf-tank-a6-a7-houston-1999/">Bolted Steel</a>
<a year="1998" title="Brick Manhole Raven 405" href="/brick-manhole-raven-405-charleston-1998/">Brick Manhole</a>
<a year="9999" title="Wetwell Vault Rehab" href="/wetwell-vault-rehab/">Wetwell Vault</a>
</div>
答案 0 :(得分:1)
http://isotope.metafizzy.co/events.html
$container.isotope( 'on', 'layoutComplete', function(){ … } ); //only set this up once
$container.isotope({ sortBy: sortByValue });
http://isotope.metafizzy.co/v1/tests/callbacks.html
$container.isotope({ sortBy: sortByValue }, function(){ … });