同時滾動內滾動條頁面滾動

Question

我有3滾動條divs。如果我們移動一個滾動條並且它到達滾動區域頁面的末尾也滾動。

我想解決這個問題。

小提琴。 http://jsfiddle.net/78h8e88x/2/

html, body { 
height: 100%; 
position:relative; 
} 

    body 
{ 

line-height:100px; 
text-align:center; 
} 

    .left 
{ 
    position:absolute; 
    margin-left:5%; 
    margin-top:3%; 
    display:block; 
    height:80%; 
    width:20%; 

    overflow:auto; 
} 

    .center 
{ 
position:absolute; 
margin-left:25%; 
margin-top:3%; 
display:block; 
height:80%; 
width:50%; 

overflow:auto; 
    } 

.right 
{ 
    position:absolute; 
    margin-left:75%; 
    margin-top:3%; 
    display:block; 
    height:80%; 
    width:20%; 

    overflow:auto; 
} 

如果我們移動一個滾動條，且到達滾動區域頁面也滾動結束。

Answer 1

默認情況下，body元素的邊距爲8px（至少在Chrome中）。在你的小提琴的情況下，這使得內容稍大，然後窗口，從而出現一個滾動條。正文將邊距設置爲0將刪除此滾動條。看到j​​sfiddle：https://jsfiddle.net/vbvmLbmq/

這當然只能修復您的小提琴的滾動行爲，這是一個窗口大小的問題。您可以完全禁止在html，body元素上滾動，通過向它們添加css規則，但請記住，它還會隱藏流過這些元素高度的任何元素。

在子元素滾動到達最後時繼續滾動頁面是瀏覽器應用程序的行爲，您無法在頁面上使用JavaScript來影響瀏覽器應用程序的行爲。