3

我尝试将 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();
            })
        });

我放了两次砌体脚本，因为当我只是将流沙脚本放在一起时，它不适用于第一次加载。
问题是，当我单击#vers a 时，它将被排序然后消失，因为.theMagz 给定高度=0。任何人都知道如何解决它？

4

0 回答 0