Firefox 上的 JQuery .position() 和 .offset() 错误

Question

我有一个通过 JQuery 确定中间元素的滚动 DIV。我尝试使用 position() 和 offset() 参数，在这两种情况下，Firefox 都没有得到正确的答案，而 Chrome 和 Safari 可以。

position().top 或 offset().top 确定了容器中间元素的位置。然而，Firefox 是从滚动容器中确定它的，因此在滚动过程中总是向下而不是中间元素。

这里有 2 个小提琴，一个使用 .position()，另一个使用 .offset()。

OFFSET() -- http://jsfiddle.net/pxfunc/XHPYF/7/ 位置 () -- http://jsfiddle.net/U4qyp/133/

有人知道为什么会发生这种情况或如何解决吗？

Answer 1

如果您查看实际的 js 文件，滚动行为的处理方式因浏览器而异。对于 Firefox，它正在操作滚动元素的-moz-transform，而不是其中的位置。

演示：http://jsfiddle.net/vQXqq/

jQuery

function test() {

    var $ul = $('#leftwheel');

    $('#bkodate').val('');

    $ul.find('li').each(function(n) {

        var $this = $(this);

        var $mozTransform = $(".slotinner").css("-moz-transform");
        var mozfix = !($mozTransform === null) ? parseInt($mozTransform.substring($mozTransform.lastIndexOf(',') + 1, $mozTransform.length - 3)) : 0;

        if ($this.position().top + $this.height() + mozfix > 100 && $this.position().top + mozfix < $ul.height()) {

            var result = $('#leftwheel li:eq(' + parseInt(n - 2) + ')').html();
            $('#bkodate').val(result);
        }
    });
}
var leftwheel = new iScroll('leftwheel', {
    snap: 'li',
    momentum: true,
    hScrollbar: false,
    vScrollbar: false,
    onScrollEnd: function() {
        test();
    }
});