jquery に Isotope プラグインを使用しようとしています。そのため、jquery 1.9.1、jqueryui 1.10.1、およびブートストラップ 2.3.1 で開発している Web サイトがあります。
コンテナーにアイテムを並べ替えたり追加したりしようとしていますが、何も機能していないようです。イベントが発生し、Isotope コードが呼び出されますが、ソートもアイテムも追加されません....
これはjquery 1.9.1とjquery 1.9.2を使用したjsfiddleで、ブートストラップはありません...同じ結果です。私は何を間違っていますか：
一言で言えばコード：
HTML:
<div class="isoContainer" style="background-color: transparent">
<div class="isoItem" data-collectiontag="Cool stuff">
<more stuff>
</div>
<div class="isoItem" data-collectiontag="Zippy Stuff">
<more stuff>
</div>
</div>
JavaScript:
$(function () {
var $container = $('#isoContainer');
$container.isotope({
itemSelector: '.isoItem',
animationEngine: 'best-available',
getSortData: {
Catname: function ($elem) {
return $elem.attr('data-collectionTag');
}
}
});
$('#randomBtn').click(function () {
$('#isoContainer').isotope({
sortBy: 'random'
});
});
$('#descBtn').click(function () {
$('#isoContainer').isotope({
sortBy: 'Catname',
sortAscending: false
});
});
$('#AddBtn').click(function () {
var $newItems = $('<div class="isoItem" data-collectionTag="aaa"><span style="text-align:center">aaa</span></div> </div><div class="isoItem" data-collectionTag="zzz"><span style="text-align:center">zzz</span></div> </div>');
$('#isoContainer').isotope( 'insert', $newItems );
});
});