【问题标题】:Why does jQuery .css('left') and .position().left return different values?为什么 jQuery .css('left') 和 .position().left 返回不同的值?
【发布时间】:2012-08-05 07:17:51
【问题描述】:

我得到的 $(el).css('left')$(el).position().left 的值不同吗?

如果我去$(el).css('left', '100px'),然后$(el).css('left') 它返回110px 而不是100px(是的,它总是多10%),如果我评估$(el).position().left,它会给我100

为什么 Chrome 会这样?您可以使用 left 属性查看这将如何影响 jQuery 动画。

我在 Ubuntu 上使用 Chrome 21.0.1180.57。

编辑 1:似乎只影响 Chrome,FF 14.0.1 给了我相同的值。

【问题讨论】:

    标签: jquery google-chrome jquery-animate


    【解决方案1】:

    left 返回 CSS left 属性的计算值。

    position().left 返回相对于元素的第一个偏移父元素的 x 坐标。

    这些值 can be equal 可以是 not equal

    position().left 也可以很容易地成为 different between browsers,因为渲染不同,而 .css("left") 只能在给定的单位上有所不同,如果那样的话。

    【讨论】:

    • 除非.css("left") 没有这样做! i.imgur.com/auymh.png 在 chrome 上,.position().left 给了我 CSS left 属性值。
    • @GauravDadhania 你能告诉我一个 jsfiddle 吗?在屏幕截图中,它们具有不同的值。一个是 1145,另一个是 1040。
    • 嗯,我尝试重新创建它,但标记/样式太复杂了。然而,最终,将div.jspDragpositionrelative 更改为absolute 修复了它!现在,当我使用.css("left") 时,我得到了实际的left 属性。你知道为什么position: relative 是罪魁祸首吗?
    • @GauravDadhania 在绝对定位时,style.left 应该等于 position().left,因为该元素不在文档流中,除了它的偏移父元素和 .style.left 之外没有任何影响它的定位。当元素受流影响时,除了.style.left 之外,还有更多的东西会影响它在文档中的最终位置,如我的 jsfiddles 所示。
    • 哦,是的,我明白了,但无论哪种情况,.css("left") 都应该返回 CSS left 属性值。正如您在屏幕截图中看到的,当元素相对定位时,.css("left") 正在返回不同的东西。根据您的 JSFiddles,.position().left 应该会受到影响,.css("left") 应该始终返回 CSS 属性值。
    【解决方案2】:

    试试这个代码:

    $("#div")[0].style.left
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-09-21
      • 1970-01-01
      • 2015-03-27
      • 2011-05-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-11-15
      相关资源
      最近更新 更多