jQueryの石積みアイテムの注文

Question

ここで元のアイテムの注文をより多く尊重するにはどうすればよいですか？あなたは彼らのAPIで見ることができるよう

var $container = jQuery('.tax-product_cat #content'); 
$container.imagesLoaded(function(){ 
    $container.masonry({ 
     itemSelector: 'li.product', 
     gutterWidth: 22 
    }); 
}); 

Answer 1

は石工のプラグインは、道やオプションを並べ替えに多くを提供していません：私はイルカ、魚、無脊椎動物、鰭脚類にするためにしたいと思います。しかし、同じ著者によるアイソトープ・プラグインは、多数のソート・オプションを提供しています。

http://isotope.metafizzy.co/

あなたが知っているだけので、あなたはここでソート参照があります。この(function($){ //your code here })(jQuery);

var container = $('.tax-product_cat #content'); 

container.isotope({ 
    itemSelector : 'ul li', 
    getSortData : { 
    category : function (el) { 
     // el refers to each item matching `itemSelector` 
     return el.find('h3').text().trim(); 
    } 
    }, 
    sortBy : 'category', 
    sortAscending : true 
}); 

のようにすべてのあなたのjQueryのコードをラップすることができます。 http://isotope.metafizzy.co/docs/sorting.html また、ドキュメントはいくつかの追加SORTBY paramsは指定しています

• 「をオリジナルのオーダーは、」レイアウトでそれらを配置するアイテム要素の元の順序を使用します。
• 'random'はランダムな順序です。

ここでは簡単なデモを示し、動作させるためのすべてを示しています。コードが何をしているのか試してみて、同じようにコードを調整してください。あなたが好きなようにソートしていない場合は、必要なモードを見つけてください。 getSortDataオブジェクトを参照してください。 categoryはです。を定義してください。それは完全に恣意的です。 backwardsカテゴリを作成し、データを適切な方法で返す関数を記述するだけです。

http://jsfiddle.net/SRW6g/19/embedded/result/

Answer 2

にするjQueryの石工用plugin - "masonry-ordered"あなたは、私が提供するデモをチェックアウトすることができ、ソート

1, 2, 3 
4, 5, 6 
7, 8, 9