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

Question

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

position().top 或 offset().top 确定中间元素相对于容器的位置。然而，Firefox 是从滚动容器中确定它的，因此在滚动过程中始终将第三个元素而不是中间元素向下放置。

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

OFFSET() -- http://jsfiddle.net/pxfunc/XHPYF/7/ POSITION () -- 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();
    }
});