rtl方向的jQuery scrollLeft - FireFox和Chrome中的不同值

Question

我有以下简单的HTML：

<div id='d1'>
    <div id='d2'>
        <table id='d3'>
            <tr>
                <td>T1</td>
                <td>T2</td>
                <td>T3</td>
                <td>T4</td>
                <td>T5</td>
                <td>T6</td>
                <td>T7</td>
            </tr>
        </table>
    </div>
</div>
<br />
<span id='s1'></span>

CSS：

    #d1{
        width: 400px;
        overflow: auto;
        direction: ltr;
    }
    #d2{
        width: 800px;
    }
    #d3{
        border:1px solid #ccc;
    }
    #d3 tr td {
        width:120px;
        height: 200px;
    }
    #s1 {
        font-size: 25px;
        color:#f00;
    }

JS / jQuery：

    var scroll;
    jQuery("#d1").on("scroll", function() {
        scroll = jQuery("#d1").scrollLeft();
        jQuery("#s1").html(scroll);
    });
    var scroll = jQuery("#d1").scrollLeft();
    jQuery("#s1").html(scroll);

See it Online

红色数字是任何时刻的滚动值，FireFox和Chrome中的值完全相同，但当我改变方向为rtl时，事情发生了变化，See it Online，

• 在第一个FireFox中，滚动值为0，当向左滚动时，值更改为-400
• 但是在Chrome中，从400开始，当向左滚动时，值会变为0

问题是当我试图检测滚动条是在第一个还是在结尾时，我必须如何处理这种差异？ （正如你所注意到的，Chrome的第一个是400，FireFox的第一个是0和......）

当然我可以检测浏览器并做不同的计算，比如这个StackOverflow Question，但我不想这样做，因为这样我必须检查每个浏览器（FF，Chrome，Safari ...）和IE（6,7， 8,9,10,11 ...）

Answer 1

我给了同样的问题here解决方案

它使用特征检测，而不是浏览器检测。

Answer 2

当方向是rtl时，firefox从零滚动到负数，从正数滚动到零。当网站在第一次加载时初始化时，您应该从这些数字中检查滚动侧。

scrollNegative = elm.scrollLeft > 0 ? false : true;

认出来之后。现在你可以通过scrollLeft向右或向左检测你应该在哪里滚动。