jQuery:实际的div宽度

Question

我有两个<div>,一个嵌套到另一个定义如下:

<div class="wrapper">
    <div class="content">
        [..] Content [..]
    </div>
</div>

css:

#div.wrapper
{            
    width: 660px;
    overflow: hidden;
    float: left;
}
#div.content
{
    white-space: nowrap;
}

效果就是我想要的,内容在内部水平放置但在超过时隐藏,(然后我用jQuery滚动它).

因为我不知道的内容.content(也可以预见),我需要知道真实的它(由内容所定义的)宽度,但两者.width()并.innerWidth()给我同样的结果是660首次调用时(如容器 div)和660 + x,当我通过设置一个负边距 - 左边滚动它后调用它(x是带边距的左移位).

如何获得元素的真实的,依赖于内容的宽度？谢谢

Answer 1

默认情况下,Div在其父级中占据全宽,因此宽度始终为父级的宽度.

如果你不想那样,你会用

#div.content
{
    white-space: nowrap;
    display: inline-block;
}

或者可能

#div.content
{
    white-space: nowrap;
    float: left;
}

将#div.content元素分别转换为内联元素或浮点元素,只占用所需的空间(即不一定是父元素提供的所有空间).这应该工作!