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();
            })
        });

石工スクリプトを 2 回配置しました。これは、流砂スクリプトと一緒に配置しただけでは、最初のロードでは機能しないためです。
問題は、#vers a をクリックすると、.theMagz に height=0 が指定されているため、並べ替えられてから消えることです。誰でもそれを修正する方法を知っていますか?

4

0 に答える 0