Chrome擴展滾動條放置

涉足Chrome擴展後，我注意到，當頁面動作內的數據到達某個點時，滾動條會自動附加到彈出窗口，這是我的預期。但是，不是將內容推送到滾動條的左側，而是覆蓋內容，導致水平滾動條變爲活動狀態。我最終只是添加了一個對數據的檢查，並應用一個css類將內容向左推進，以便與滾動條並行運行，並且不在其下方。除了我的黑客解決方案之外，處理這個問題的正確方法是什麼？Chrome擴展滾動條放置

來源

2011-04-05 chrisw

我也在想這個。當垂直滾動條顯示的內容至少不跳

body {overflow-x:hidden;overflow-y:auto;}

所以：目前我只是不把任何東西重於20像素更接近彈出窗口的右側，並禁用水平滾動條。

來源

2011-04-05 16:30:14 serg

唯一的問題是，當沒有足夠的內容導致溢出時，它會在右側創建空白空間。這基本上就是我在建議的解決方案之前所做的。 – chrisw 2011-04-05 16:38:24

也許你需要在滾動條上指定一個寬度。

::-webkit-scrollbar { 
    width: 42px; //Do not know actual width, but I assume you do 
}

來源

2011-04-05 16:49:23 Eric

我還沒有找到一個方法來做到這一點，是不是黑客攻擊，但這裏是我能想到的最簡單的黑客：

<script type="text/javascript"> 
function tweakWidthForScrollbar() { 
    var db = document.body; 
    var scrollBarWidth = db.scrollHeight > db.clientHeight ? 
     db.clientWidth - db.offsetWidth : 0; 
    db.style.paddingRight = scrollBarWidth + "px"; 
} 
</script> 
... 
<body onresize="tweakWidthForScrollbar()">

這樣做是爲了檢測是否垂直滾動條正在使用，如果是，則計算其寬度併爲其分配足夠的額外填充。

來源

2011-07-31 22:52:41

這在Chrome中不起作用，'db.clientWidth - db.offsetWidth'返回0。 – w00kie 2011-12-16 10:07:34

Chrome擴展滾動條放置

回答

相關問題