獲取瀏覽器的預設滾動條寬度

2021-09-25 16:34:17 字數 409 閱讀 7411

function getbarwidth()
這是在element中實現自定義滾動條中,用於獲取瀏覽器導航條寬度的原理。

理解:首先建立乙個div,將他放在頁面乙個看不見的地方,通過絕對定位可以讓它脫離文件流,不會弄亂自己的頁面(雖然後面會移除)。獲取 offsetwidth 包括內容、內邊距、邊框和滾動條。在這裡獲取到的就是內容寬度,我們設定的100;

給外邊框設定 overflow = scroll 後 會存在滾動條。獲取子級的寬度。

通過兩次獲取的寬度相減後得到的就是瀏覽器預設的滾動條寬度。

這個可以使用在自定義滾動條中,畢竟預設的滾動條不好看。

瀏覽器寬度以及滾動條寬度計算

在獲取頁面寬度的時候從網上找到如下方法 getclientwidth else return clientwidth const pagewidth window.innerwidth 然後發現乙個很神奇的事情,為什麼在不同電腦上看到的寬度都變了,在瀏覽器1280px的時候pagewidth乙個是1...

瀏覽器滾動條

做 時發現登入成功後瀏覽器滾動條消失無法滾動頁面 通過觀察和除錯,發現是強制隱藏了bootstrap的模態框後,body的overflow變為了hidden,同時也多了乙個17px的右內邊距,無法呼叫出垂直滾動條,解決方案 隱藏模態框的同時設定body的overflow為scroll,同時取消右內邊...

CSS修改瀏覽器預設滾動條

css修改預設滾動條 滾動條寬度 box wrap webkit scrollbar 滾動條裡面小方塊 box wrap webkit scrollbar thumb 滾動條裡面軌道 box wrap webkit scrollbar track 完整示例 如下 lang en charset ut...