jQuery Masonry を Quicksand と統合しようとしましたが、うまくいきませんでした。流砂は機能しましたが、石積みは機能しませんでした。これが私のスクリプトです:
$(document).ready(function(){
// Clone portfolio items to get a second collection for Quicksand plugin
var $portfolioClone = $(".theMagz").clone();
$(function(){
var $container = $('.theMagz');
$container.imagesLoaded( function() {
$container.masonry({
gutterWidth:20
});
});
});
// Attempt to call Quicksand on every click event handler
$("#vers a").click(function(e){
$("#vers li").removeClass("current");
// Get the class attribute value of the clicked link
var $filterClass = $(this).parent().attr("class");
if ( $filterClass == "all" ) {
var $filteredPortfolio = $portfolioClone.find(".item");
} else {
var $filteredPortfolio = $portfolioClone.find(".item[data-type~=" + $filterClass + "]");
}
// Call quicksand
$(".theMagz").quicksand( $filteredPortfolio, {
duration: 800,
easing: 'easeInOutQuad'
}, function(){
var $container = $('.theMagz');
$container.imagesLoaded( function() {
$container.masonry({
gutterWidth:20
});
});
});
$(this).parent().addClass("current");
// Prevent the browser jump to the link anchor
e.preventDefault();
})
});
石工スクリプトを 2 回配置しました。これは、流砂スクリプトと一緒に配置しただけでは、最初のロードでは機能しないためです。
問題は、#vers a をクリックすると、.theMagz に height=0 が指定されているため、並べ替えられてから消えることです。誰でもそれを修正する方法を知っていますか?