Chrome中的jQuery位置问题

当我提醒值.position().left时，它在Chrome上返回0。与其他浏览器一起返回实际的数字。为什么会发生？Chrome中的jQuery位置问题

来源

2010-01-31 goksel

这样闭幕前将JavaScript代码文档中准备好，请发布更多的代码，特别是你要调用'position'的元素，或者是一些HTML/CSS来查看可能出现的问题。 – 2010-01-31 20:02:15

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

所以，如果你有图片在您的网页，使用基于WebKit浏览器，你应该在$(window).load事件触发后访问offset信息，而不是$(document).ready事件之后。

来源

2011-07-06 05:55:57

有时候即使这样也行不通。另一种选择是手动设置您的CSS图像大小。 – 2011-11-10 19:31:19

显然webkit只能访问window.load之后的文本宽度和高度属性。似乎很愚蠢的是，即使Internet Explorer可以正确使用它。我认为最后一个错误是webkit。 – 2014-09-23 21:54:45

有时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“永远不可用”，您需要在其他地方进行调试。

来源

2010-01-31 20:34:43 David

太好了，谢谢大卫的帮助。 – goksel 2010-02-02 18:19:07

谢谢 - 这也是为什么'jQuery.offset（）'返回不正确（非零）值的原因 - 它看起来像我的CSS定位导致Chrome两次（或其他）布局文档。调用'offset'过早地返回元素的位置，因为它们没有CSS。 – Justin 2011-01-27 12:48:50

+1我昨天有这个问题。即使在简单的'$（function（）{console.log（$（'img'）。position（）。top）;}）;'中，位置也是不正确的，'但是在稍后的点击事件中使用相同的代码时是正确的。 – andyb 2011-03-27 08:57:22

我有同样的问题..

我固定它使用：.offset().left代替。但请注意，是不一样的： http://api.jquery.com/offset/

.position().left曾在Chrome在一些测试中，我所做的，使用比大卫类似的方法（该值可用，因为第一次尝试）。

在我的“真正的”应用程序未能甚至阅读点击事件的位置（这可以消除任何负载速度问题）。一些意见（在其他论坛）说可能与有关，使用display:inline-block。但我不能使用inline-block重现问题。所以它可能是是另一回事。

来源

2010-02-24 06:00:10 lepe

通过阅读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 
    }; 
};

来源

2010-04-28 15:01:35 user227353

为我的问题创作奇迹......谢谢！ – 2015-12-11 12:09:24

或许有点过时与错误的位置问题因为从2010年，但这个问题的日期我在Chrome中定位问题的技巧：

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

来源

2011-04-17 13:11:30 Hekman

使用jQuery（窗口）.load（）而不是jQuery的（文件）。就绪（）

来源

2012-03-30 19:15:17 zuckerhut

-1

我用这个功能来纠正它。

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 
      }; 
     }

来源

2013-05-28 03:47:05 user2129794

对我来说，它的工作仅由body标签

它执行它加载后的代码一切

<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>

来源

2013-08-22 11:44:35

Chrome中的jQuery位置问题

回答

相关问题