网站开发中使用javascript获取浏览器滚动条宽度
在网站开发中,有时候需要获取浏览器滚动条的宽度,在武汉蚂蹄软件服务中心的技术人员指导之下,我实现了该需求。记录如下:
首先说明一下原理:
①生成一个div,设置滚动条不可见,记录其宽度;
②将上面的div设置滚动条可见,在记录div宽度;
③取两次宽度的差值,即为滚动条的宽度。
使用jQuery简单实现如下:
function getScrollWidth() { var $div = $("<div style='position:absolute; top:-1000px; width:100px; height:100px; overflow:hidden;'></div>"); $("body").append($div); var noScroll = $div[0].clientWidth; $div.css("overflow-y", "scroll"); var scroll = $div[0].clientWidth; $div.remove(); return noScroll - scroll; }