【问题标题】:Scroll content within its own div using window's main scrollbar [duplicate]使用窗口的主滚动条在其自己的 div 中滚动内容 [重复]
【发布时间】:2013-01-19 22:01:47
【问题描述】:

可能重复:
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 图像。因此,当我滚动时,可以看到文本在标题图像下方流动!

【问题讨论】:

  • 放大和缩小可以看到,示例网站的header有一个不透明的背景图片,带有道路的纹理,所以你只能用同样的方式来归档这个效果

标签: javascript jquery css html


【解决方案1】:

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

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

【讨论】:

    【解决方案2】:

    你的内容 div 应该有:

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2011-10-16
      • 1970-01-01
      • 2022-01-04
      • 1970-01-01
      • 1970-01-01
      • 2011-07-19
      • 2014-04-12
      • 1970-01-01
      相关资源
      最近更新 更多