禁用滾動條頭，但不是在一個網頁

我有標題和內容的簡單的網頁內容，它可能看起來像禁用滾動條頭，但不是在一個網頁

<div id="wrap"> 
    <div id="header"> 
    </div> 
    <div id="content"> 
    </div> 
</div>

默認情況下，在右側的滾動條，但我想要禁用/凍結標題中的滾動條，但將其保留在內容中，是否有可能通過javascrip/jquery或css來做到這一點？

感謝

前 enter image description here

後 enter image description here

來源

2012-07-12 Charles Yeung

你在說什麼主滾動條到頁面，如果是的話，給出的迴應將不起作用。他們只能用於內聯滾動條。 – TK123 2012-07-12 02:14:40

您可以通過給內容固定的高度並設置overflow-y: scroll來實現此目的。

例子：http://jsfiddle.net/XLaVa/

來源

2012-07-12 02:15:32 grc

+1感謝您的示例 – 2012-07-12 02:19:25

在CSS頁眉和overflow:scroll爲內容設置overflow:hidden。

來源

2012-07-12 02:12:25

你將不得不調整你的HTML/CSS：

<div id='wrap'> 
    <div id='header'></div> 
    <div id='content-outer'> 
     <div id='content-inner'> 
     </div> 
    </div> 
</div>

的CSS：

.content-outer { 
    height: 600px; /* or desired height */ 
    overflow-y: scroll; 
} 
.content-inner { 
    height: auto; 
}

來源

2012-07-12 02:13:42 bokonic

添加這些CSS規則：

#header { overflow: hidden; } 
#content { overflow: auto; }

您還需要限制內容的高度以防止頁面本身溢出。

來源

2012-07-12 02:13:52 nbrooks

如果你想一個滾動條添加到內容元素本身看看其他的答案。爲了實現通過瀏覽器的滾動條類似的效果嘗試position:fixed在標題：

#header { 
    position : fixed; 
    top : 0px; 
    width : 100%; 
    height : 30px; 
    background-color:white; 
} 
#content{ 
    margin-top : 30px; 
}

演示：http://jsfiddle.net/GUeUe/

（注：IE < = 6不支持position:fixed。）

來源

2012-07-12 02:30:13 nnnnnn

禁用滾動條頭，但不是在一個網頁

回答

相關問題