回答
這似乎工作。在調整窗口大小時,元素也將調整大小,以便僅在沒有足夠空間顯示所有內容時才能滾動。
setWindowHeight();
function setWindowHeight() {
var windowHeight = window.innerHeight;
document.body.style.height = windowHeight + "px";
}
window.addEventListener("resize", setWindowHeight, false);
.float {
float: left;
width: 33%;
height: 100%;
}
.left {
background: #f00;
}
.center {
background: #0f0;
}
.right {
background: #00f;
}
.scrollable {
height: 100%;
overflow-y: scroll;
}
<body>
<div class="float left">
Left
</div>
<div class="float center">
<div>
Center
</div>
<div class="scrollable">
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
<p>Scrollable</p>
</div>
</div>
<div class="float right">
Right
</div>
</body>
謝謝,看起來不錯。即使我無法得到它的工作。看看這個實例:http://wernersbacher.de/pro/goldenminer/ – wernersbacher
它看起來和我在例子中做的非常相似。你有什麼麻煩讓它工作?如果將該代碼轉儲到單個HTML文件中,則呈現效果良好。 – DunningKrugerEffect
我只是不確定它爲什麼不工作:身體捲動,而不是內部的div。 – wernersbacher
- 1. 滾動溢出可見
- 2. 滾動時隱藏溢出
- 3. 我可以刪除溢出的底部滾動條:滾動嗎?
- 4. 溢出滾動
- 5. 溢出滾動不滾動?
- 6. 溢出和滾動
- 7. 滾動表格以避免溢出
- 8. 帶溢出的可滾動包裝
- 9. HTML水平溢出可見,垂直溢出滾動
- 10. 動畫滾動div與溢出滾動
- 11. 歇文本三行溢出
- 12. CSS溢出滾動已發行
- 13. 溢出隱藏和滾動同時
- 14. 設置溢出滾動無底滾動
- 15. CSS - 溢出 - 滾動條滾動太多
- 16. 可以在Javascript中控制CSS溢出滾動條嗎?
- 17. 你可以讓一個HTML元素溢出 - 垂直滾動嗎?
- 18. CSS |溢出滾動問題
- 19. 溢出-y滾動問題
- 20. 網頁溢出滾動條
- 21. iOS禁用頁面使用溢出滾動進行滾動:touch
- 22. 使用「-webkit溢出滾動:觸摸」的實時滾動事件
- 23. 溢出時顯示不必要的水平滾動條:滾動
- 24. 隱藏的WebKit滾動條時溢出滾動:觸摸啓用
- 25. 當高度變化時創建可滾動溢出-y?
- 26. Chrome的滾動條消失的三個部分(不溢出-Y)
- 27. 即使沒有什麼可滾動,css溢出滾動條也會出現
- 28. Hypertable啓動時溢出內存溢出
- 29. 在css中溢出滾動的浮動
- 30. 滾動到溢出項目:自動格
你能請張貼,你試過嗎? – Pugazh
http://stackoverflow.com/help/how-to-ask –