使用窗口的主滚动条在其自己的div中滚动内容

时间:2013-01-19 13:46:51

标签: javascript jquery html css html5

  

可能重复:
  Scroll particular DIV contents with browser’s main scrollbar

我正在尝试复制'使用资源管理器的主滚动条滚动特定div并隐藏固定(位置:固定)标题下的内容。

this website查看示例。在您可以看到的网站中,中间的内容可以通过窗口的主滚动条滚动,内容类型隐藏在固定标题下方。

以下是我对身体的CSS(中间的内容):

#body {
    position: relative;
    padding: 0;
    margin-left: 320px;
    margin-top: 130px;
    width: 500px;   
}

这是固定标题的CSS:

#header {
    position: fixed;
    top: 0;
    text-shadow:0 -1px 0 rgba(0,0,0,0.5);   
    width: 100%;
    height: 130px;
    z-index:2;
}

中间的内容目前在固定标题下方滚动,但它显示在那里,因为我的标题只是一个PNG图像。因此,当我正在讨价还价时,可以看到文本在标题图像下方流动!

2 个答案:

答案 0 :(得分:2)

您应该在标题背景上使用与实际身体背景相同的背景图像(相同纹理),并且您将获得所需的效果。

http://jsbin.com/uqimac/1/edit

答案 1 :(得分:0)

您的内容div应该有:

#content {
  height:500px; /* some fixed height */
  overflow:hidden; /* hide the scrollbars */
}