如何使沒有主要垂直滾動條的窗口

我正在使用jQuery庫Nanoscroller來獲取內容div滾動，如果它有很多的內容，並且它做得很好。但是，我遇到的問題是，瀏覽器窗口上仍然有一個大滾動按鈕（即頁面右側的常規滾動按鈕）。如何使沒有主要垂直滾動條的窗口

我想要的是頭部位於頂部，底部位於底部，內容始終佔用瀏覽器窗口中剩餘的任何高度。這樣，唯一的滾動按鈕將是內容div中的Nanoscroller。我想是這樣的：

Example 我使用的代碼是這樣的：

<body> 
<div id="container"> 
    <div id="header"> 
     header 
    </div> 

    <div id="mycontent" class="nano"> 
     <div class="content"> 
      my content 
     </div> 
    </div> 

    <div id="footer"> 
     footer 
    </div> 
</div> 
</body>

有了這個CSS：

html, body { 
margin: 0; 
padding: 0; 
} 

#container { 
    margin: 0; 
} 

#header { 
    text-align:center; 
    background: #777; 
    color:#fff; 
    height:50px; 
} 

#mycontent { 
    background-color:red; 
} 

#footer { 
    background-color:blue; 
     clear:both; 
     height: 50px; 
}

我曾試圖使固定位置的各種組合對於頁眉和頁腳，將高度設置爲mycontent div的100％，並且仍然沒有喜悅。我似乎總是會看到頁面太多，這樣我就會看到主要的滾動條出現。

歡迎任何想法，謝謝。

來源

2014-02-05 b85411

使用position: fixed代替：

#footer { 
    position: fixed; 
    background-color: blue; 
    width: 100%; 
    height: 50px; 
    bottom: 0; 
} 

body { 
    overflow-y: hidden; 

#mycontent { 
    overflow-y: auto; 
}

來源

2014-02-05 07:26:55 Raptor

謝謝你的回覆，這工作。 – b85411

html, body { 
overflow:hidden; 
}

來源

2014-02-05 07:23:46

您好，感謝您的回覆。不幸的是，只是切斷了頁面溢出的任何東西，所以我的頁腳現在實際上已隱藏起來。 – b85411

如何使沒有主要垂直滾動條的窗口

回答

相關問題