3

目前我在使用 jQuery Masonry 插件时遇到了一个恼人的错误。交易是这样的：我想做一个两栏的常见问题页面，在那里我用砖石浮动 div。这个 div 里面是一个 h3-Tag，它会触发一个 slideToggle 事件，并展开一个隐藏的 div (div.answer)。问题是，如果我单击 h3-tag 并触发事件，div.answer 会展开，但会覆盖下面的 div 几秒钟，直到它到达最终且正确的位置。

这是 slideToggle 事件的脚本：（如您所见，我已经尝试在脚本内的多个位置调用 masonry 函数，但它没有解决问题）

$(document).ready(function() {
            $('.answer').hide();
            $('#container').masonry();
            $('.show').click(function() {
                imgelem = $(this);
                $(this).parent().next().stop().slideToggle("slow", function() {
                    $('#container').masonry('reload');
                    if ($(this).css("display") == "none") {

                        imgelem.attr("src", "images/expand.png");
                    }
                    else {
                        imgelem.attr("src", "images/collapse.png");
                    }
                });
                    $('#container').masonry();
            }); 
            $('#container').masonry('reload');  
        });

在这里你可以看到问题：http: //jsfiddle.net/2huZd/3/

我希望有一个人可以帮助我！

编辑：没有人能解决这个问题？:(

4

2 回答 2

1

您可以使用该功能step上的选项slideToggle()并告诉砌体重新计算每个步骤的位置......但如果您的网格上有太多元素，则可能需要处理太多信息。

于 2015-12-21T16:48:28.067 回答
0

我在使用另一个类似 masonr 的插件（shapeshift）时遇到了同样的问题。问题是 slideToggle 的回调事件只有在幻灯片效果完全准备好后才会触发。没有（我至少没有找到）任何“期间”事件会在每个滑动步骤上重新初始化砌体。

我发现的唯一解决方案是用显示/隐藏切换替换幻灯片效果。盒子令人讨厌的重叠效果将不再可见，而且我认为用户体验会更好。

于 2013-05-21T07:44:23.807 回答