1

在可滚动区域内调用覆盖。使用 tinyscrollbar 插件( [http://www.baijs.nl/tinyscrollbar/][1] ),当调用覆盖时,我想将 tinyscrollbar 中的滚动选项设置为 false。这是标题中的脚本:

<script type="text/javascript">
    $(document).ready(function () {
        $('#scrollbar2').tinyscrollbar({ scroll: true });
    });
</script>

这是覆盖脚本:

<script>
    $(document).ready(function () {
        $("img[rel]").overlay({
            onBeforeLoad: function (event) {
                $('#scrollbar2').tinyscrollbar({ scroll: false });
            },
            onClose: function (event) {
                $('#scrollbar2').tinyscrollbar({ scroll: true});
            }
        });
    });
</script>

如您所见,在 onBeforeLoad 中,我尝试将滚动设置为 false,而 onClose 将其设置回 true,但这些都被忽略了。对 jquery 来说有点新,所以不确定如何动态更改这些选项。在设置滚动选项后尝试调用 tinyscrollbar_update() 但没有任何效果。不知道该怎么做...

4

1 回答 1

0

虽然我想不出任何不向 tinyscrollbar 源代码添加代码的解决方案,但我确实想出了一个解决方法。由于在页面加载后让 tinyscrollbar 更改的唯一方法是调用 tinyscrollbar_update(),因此在我的脚本中调用覆盖功能,在 onBeforeLoad 中,我使封闭的“.overview”容器的高度小于最小高度调用滚动条,然后调用 tinyscrollbar_update()。由于 tinyscrollbar 看到它不需要渲染自己,它就消失了。然后,在 onBeforeClose 中,我只是将高度重置为原来的高度,再次调用 tinyscrollbar_update() 并且滚动条重新出现。

这是修改后的代码:

<script>
    $(document).ready(function () {
        $('#scrollbar2').tinyscrollbar();

        $('img[rel]').overlay({
            oneInstance: false,
            onBeforeLoad: function (event) {
                $('.overview').css('height','150px');
                $('#scrollbar2').tinyscrollbar_update();
            },
            onBeforeClose: function (event) {
                $('.overview').css('height','auto');
                $('#scrollbar2').tinyscrollbar_update();
            }
        });
    });
 </script>
于 2013-03-29T13:01:07.127 回答