除了IE之外,在所有浏览器中通过Javascript平滑同步滚动?

时间:2015-11-30 02:15:21

标签: javascript jquery html optimization scrollbar

我在dom.ready上触发了这两个滚动事件,它们同步主文档和div的水平滚动条之间的滚动。所有浏览器都可以正常工作 - 除了内容有点沉重的IE浏览器中的一些恼人的jank。

单挑:jsScroll0和jsScroll1标志会阻止滚动条锁定,因为每个滚动条试图设置彼此的值时会出现无限循环情况。

    $(document).ready(function () {
    //-------------------------------------------
    //  S y n c   t w o   S c r o l l b a r s
    //-------------------------------------------
    // Ver.01
    //Basically the same as my concept:
    //http://stackoverflow.com/questions/762274/how-to-synchronize-scrolling-positions-for-several-iframes
    //Sync's scrollbars, and the flags fix infinite loop.
    //ALSO:
    //http://stackoverflow.com/questions/18952623/synchronized-scrolling-using-jquery
    //has % for scrollbars of different sizes
    var jsScroll0;
    var jsScroll1;
    var windows = [$(document), $('#scrollP')];
    windows[0].on('scroll.scrollInTheSameTime', function () {
        if (jsScroll1 === true) {
            jsScroll1 = false;
            return;
        }
        jsScroll0 = true;
        windows[1].scrollLeft(windows[0].scrollTop());
    });
    windows[1].on('scroll.scrollInTheSameTime', function () {
        if (jsScroll0 === true) {
            jsScroll0 = false;
            return;
        }
        jsScroll1 = true;
        windows[0].scrollTop(windows[1].scrollLeft());
    });
});

我认为问题的症结在于IE为什么会挣扎而另一方却没有? IE是否完全不同地处理滚动/触发事件?

ATTEMPT:我尝试使用 document.documentElement.scrollTop /删除jquery开销,并通过 document.getElementById('scrollP')访问div - 但是它没有什么区别。

0 个答案:

没有答案