CSS - 防止滾動但留下滾動條

Question

我使用overflow:hidden來防止在顯示覆蓋圖時滾動滾動。問題是這將刪除滾動條，因此整個頁面向右移動一點。當疊加層被移除並且溢出設置回自動時，它會再次移動。

有沒有辦法解決這個問題？我想凍結滾動的文檔，但想阻止頁面跳轉。

jsfiddle

Answer 1

可以補充一點：

html { 
    overflow-y:scroll; 
} 

的body元素會隱藏溢出（因爲你已經擁有它），而html元素只會顯示一個空的滾動條。這是有效的，因爲您碰巧有html和body設置爲height:100%。

演示：http://jsfiddle.net/BCX64/3/

或者，您也可以防止滾動這樣的，當你表現出的疊加：

// Find current scroll positions 
var top = $(window).scrollTop(); 
var left = $(window).scrollLeft() 

$(window).scroll(function(){ 
    // Force scroll back to original positions 
    $(this).scrollTop(top).scrollLeft(left); 
}); 

然後解除綁定的情況下，當你隱藏覆蓋：

$(window).unbind('scroll'); 

你在這種情況下不需要noscroll類。

演示：http://jsfiddle.net/BCX64/6/

Answer 2

如果你創建一個假的滾動條，並將其放置在右側..你可以自定義的設計了。