js取捲軸的尺寸執行個體代碼

標籤：style   blog   class   code   c   java   

分享一個js取捲軸的尺寸的函數代碼，很簡單，很實用。

建立一個嵌套節點，讓外層節點產生捲軸，然後用offsetWidth - clientWidth即可獲得捲軸寬度。

注意，為了避免頁面抖動，可以設定外層元素position:absolute和visibility:hidden

完整代碼：

function getScrollWith(){ var wrap = setAttributes(document.createElement(‘div‘),{ style : { width : ‘200px‘, height: ‘200px‘, overflow: ‘auto‘, position:‘absolute‘, visibility:‘hidden‘ } }) var inner = setAttributes(document.createElement(‘div‘),{ style : { width : ‘100px‘, height: ‘2000px‘ } }) document.body.appendChild(wrap); wrap.appendChild(inner); var w = wrap.offsetWidth - wrap.clientWidth; document.body.removeChild(wrap); wrap = null; inner = null; return w; } www.jbxue.comfunction setAttributes(elem,opts){ for(var key in opts){ if(typeof opts[key] == ‘string‘){ elem[key] = opts[key]; }else{ if(!elem[key]){ elem[key] = {}; } setAttributes(elem[key],opts[key]); } } return elem; }