js取滚动条的尺寸的函数代码
js取滚动条的尺寸的函数代码
发布时间:2016-12-30 来源:查字典编辑
摘要:这个比较简单,做个记录而已。创建一个嵌套节点,让外层节点产生滚动条,然后用offsetWidth-clientWidth即可获得滚动条宽度。...

这个比较简单,做个记录而已。

创建一个嵌套节点,让外层节点产生滚动条,然后用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;

}

function 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;

}

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类