jQuery .css("left") 在 Chrome 中返回 "auto" 而不是实际值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4278148/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery .css("left") returns "auto" instead of actual value in Chrome
提问by Shadow Wizard is Ear For You
I have div element with left and top defined, without absolute position, and I want to read the left and top values using jQuery.
我有定义了 left 和 top 的 div 元素,没有绝对位置,我想使用 jQuery 读取 left 和 top 值。
Using $("#MyId").css("left")
gave the expected result in IE browser (IE8) but in Chrome it returned "auto" instead, although the values are explicitly written in the element style.
Using$("#MyId").css("left")
在 IE 浏览器 (IE8) 中给出了预期的结果,但在 Chrome 中它返回了“auto”,尽管这些值明确地写在元素样式中。
Here is the test case: http://jsfiddle.net/qCDkb/2/
这是测试用例:http: //jsfiddle.net/qCDkb/2/
Note the difference between IE and Chrome.
请注意 IE 和 Chrome 之间的区别。
Also, this is working well in jQuery 1.4.2 and "failing" in jQuery 1.4.3 and above.
此外,这在 jQuery 1.4.2 中运行良好,在 jQuery 1.4.3 及更高版本中“失败”。
Any insights are welcome. :-)
欢迎任何见解。:-)
采纳答案by Pekka
As discussed in the comments, setting left
to auto
for a position: static
sounds somehow right, seeing as left
has no meaning in the context.
正如在评论中讨论的那样,设置left
到auto
一个position: static
声音莫名其妙的权利,看到left
在上下文中没有任何意义。
As to why Chrome and IE return different values: .css()
provides a unified gateway to the browsers' computed style functions, but it doesn't unify the way the browsers actually compute the style. It's not uncommon for browsers to decide such edge cases differently.
至于为什么Chrome和IE返回不同的值:.css()
提供了浏览器计算样式函数的统一网关,但并没有统一浏览器实际计算样式的方式。浏览器以不同方式决定此类边缘情况的情况并不少见。
As to why jQuery 1.4.2 and 1.4.3 do this differently, I do not know for sure, but there's this in 1.4.3's release notes:
至于为什么 jQuery 1.4.2 和 1.4.3 以不同的方式执行此操作,我不确定,但在1.4.3 的发行说明中有这一点:
Nearly the entire CSS module has been rewritten focusing entirely on extensibility. You can now write custom CSS plugins that extend the functionality provided by .css() and .animate().
几乎整个 CSS 模块都被重写,完全专注于可扩展性。您现在可以编写自定义 CSS 插件来扩展 .css() 和 .animate() 提供的功能。
回答by Steven Benjamin
Try $("your selector").position().top;
尝试 $("your selector").position().top;
回答by vtambourine
It is strange behavior for jQuery. But you can use native javascript methods to get css values:
这是 jQuery 的奇怪行为。但是您可以使用原生 javascript 方法来获取 css 值:
$("#Panel1")[0].style.left
This expression will return corresponding css property.
此表达式将返回相应的 css 属性。
回答by montrealmike
add
添加
position: absolute;
or
或者
position: relative;
to the element you use left on
到您使用的元素 left on
回答by g3logic
I know this is an old post, but I ran into this same problem and thought I would suggest a couple of solutions. It seems that this problem is not specific to Chrome, as I was able to reproduce in Firefox as well.
我知道这是一篇旧帖子,但我遇到了同样的问题,并认为我会提出几个解决方案。这个问题似乎不是 Chrome 特有的,因为我也能够在 Firefox 中重现。
I was able to solve this one of two ways. Either place you CSS styles in the same file as your HTML, instead of using a separate CSS file. OR, call the function inside of window.onload. Looks like the values are not available to the browser until everything has loaded, IF the styles are in an external style sheet.
我能够通过两种方式之一解决这个问题。要么将 CSS 样式放在与 HTML 相同的文件中,而不是使用单独的 CSS 文件。或者,调用 window.onload 内部的函数。如果样式位于外部样式表中,则在加载所有内容之前,浏览器似乎无法使用这些值。
Hope this is helpful.
希望这是有帮助的。