滚动条不会在页面上更新

时间:2011-02-25 14:11:44

标签: javascript jquery jquery-plugins scrollbar jquery-masonry

我正在使用页面上的jQuery Masonry插件。我已对其进行了设置,以便在单击一个框时,会显示一个弹出对话框,其中包含该框的内容。

我创建了一个演示here

在显示弹出窗口之前,页面上有一个滚动条,因为所有框都不适合那里。单击其中一个框时,我会将内容附加到弹出窗口并显示它。我隐藏了所有其他框但滚动条没有更新以反映弹出窗口,即弹出窗口中的内容小于查看区域但滚动条仍然保留在框中。

如果你明白我的意思,你能帮助我吗?

感谢。

1 个答案:

答案 0 :(得分:2)

砌体对包含#grid元素应用固定高度,这就是即使所有内容都被隐藏,滚动高度保持不变的原因。如果将弹出元素移动到包含#grid元素之外,并在单击时显示/隐藏网格,则滚动高度将正确更新。

Updated fiddle

重点:

<div class="reader">
    <!-- content -->
</div>
<div id="grid">
    <!-- content -->
</div>

<script>
    $('.box').click(function() {
        $('.reader').show();
        $('#grid').hide();
    });

    $('.reader #close').click(function() {
        $('.reader').hide();
        $('#grid').show();
    });
</script>