使用jQuery将超大的Div元素居中

时间:2010-12-10 00:12:14

标签: javascript jquery css xhtml

我的Div元素宽度为1680像素,如下所示:

|                   |

说,实际的屏幕/浏览器画布分辨率为800px宽:

+      +

现在,我如何使用jQuery将Div居中(并隐藏其余部分),以便隐藏1680px的其余部分,如下所示:

|     +      +      |
 ^^^^^        ^^^^^^

^ = clipped from the Div.

换句话说,我希望Div在这两个+范围内显示并隐藏其余部分。如果实际屏幕分辨率大于1680像素,则Div应该正常居中而不会有任何削波。

我不确定我是否能够完美地解释这种困境,所以如果有什么不清楚的话就去问问吧。这已经让我疯了......

1 个答案:

答案 0 :(得分:4)

仅使用CSS

http://jsfiddle.net/rQfvs/

关键部分是:

#bigdiv {
    position: relative;
    width: 1680px;
    margin-left: -840px;
    left: 50%;
}

请注意,您也不一定需要container div。您只需将bigdiv放入主体即可。在这种情况下,我会将身体的溢出设置为隐藏:

http://jsfiddle.net/rQfvs/3/