Question

当我提醒值.position().left时，它会在Chrome上返回0。使用其他浏览器，它返回实际数字。为什么会这样？

Answer 1

基于Webkit的浏览器（如Chrome和Safari）只有在图像完全加载后才能访问图像width和height属性。只要加载DOM，其他浏览器就可以访问这些信息（他们不需要完全加载图像来了解它们的大小）。

因此，如果您的页面中有图像，使用基于Webkit的浏览器，您应该在offset事件触发后访问$(window).load信息，而不是$(document).ready事件之后。

Answer 2

通过阅读http://api.jquery.com/position/的评论，有几种方法可以解决这个问题。我找到的工作是

Ajaho [主持人]：此插件功能修复了问题在Chrome中位置错误

jQuery.fn.aPosition = function() {
    thisLeft = this.offset().left;
    thisTop = this.offset().top;
    thisParent = this.parent();

    parentLeft = thisParent.offset().left;
    parentTop = thisParent.offset().top;

    return {
        left: thisLeft-parentLeft,
        top: thisTop-parentTop
    };
};

Answer 3

Webkit有时可能太快，但它经常在jQuery中处理。您可以使用以下内容进行调试：

var v, elem = $('.myElement');
window.setTimeout(function() {
    v = elem.position().left;
    console.log(v);
    if (v) {
        return false;
    }
    window.setTimeout(arguments.callee, 1);
}, 1);

这将检查位置是否以及何时可用。如果您在无限远处记录“0”，则position().left“永不”可用，您需要在其他地方进行调试。

Answer 4

我遇到了同样的问题..

我使用：.offset().left修改了它。但要注意不一样： http://api.jquery.com/offset/

.position().left在我使用的一些测试中在Chrome中工作过与大卫相似的方法（自从大卫以来就有了价值）第一次尝试）。

在我的“真实”应用程序中甚至失败了读取点击事件的位置（这可能会消除任何负载速度问题）。一些评论（在其他论坛中）说它可能是相关的使用display:inline-block。但是我做不到使用inline-block重现问题。所以它可能是另一回事。

Answer 5

自问题发布至2010年以来可能有点过时，但这对我在Chrome中的定位问题起了作用：

$(window).load(function(){
  p = $('element').offset();
  // et cetera
});

Answer 6

使用jQuery（window）.load（）而不是jQuery（document）.ready（）

Answer 7

对我而言，它是通过在关闭body标签

之前将javascript代码放入文档中来实现的

这样它在加载了所有内容后执行代码

    <body>
        <div>content</div>
        <div class='footer'>footer</div>
        .
        .
        .

        <script type='text/javascript>
            $(document).ready(function(){
              var footer_position = $(".footer").offset().top;
              console.log(footer_position);
            });
        </script>
     </body>

Answer 8

我使用此功能来纠正它。

function getElementPosition(id) {
          var offsetTrail = document.getElementById(id);
          var offsetBottom = 0;
          var offsetTop = 0;
          while (offsetTrail) {
              offsetBottom += offsetTrail.offsetBottom;
              offsetTop += offsetTrail.offsetTop;
              offsetTrail = offsetTrail.offsetParent;
          }

          return {
              bottom: offsetBottom,
              toppos: offsetTop
          };
      }

Chrome的jQuery位置问题

8 个答案: