div 里面套table 出现滚动条，JS怎么计算滚动条的宽度
parseInt(div。offsetWidth)-parseInt(div。scrollWidth)算出来结果总是2求解只要在计算宽度之前加上一个alert结果就是正确...
parseInt(div。offsetWidth) - parseInt(div。scrollWidth)
算出来结果总是2 求解
只要在计算宽度之前 加上一个alert 结果就是正确的了，难道这里还需要延迟一下么。
只有在IE7的时候才出现，IE8,9，FF都是好的
经过试验 发现div。offsetWidth 这个值在IE7下读出来的不正确 展开
算出来结果总是2 求解
只要在计算宽度之前 加上一个alert 结果就是正确的了，难道这里还需要延迟一下么。
只有在IE7的时候才出现，IE8,9，FF都是好的
经过试验 发现div。offsetWidth 这个值在IE7下读出来的不正确 展开
4个回答
展开全部
<html>
<head>
<title>Scroll Bar Size</title>
</head><script type="text/javascript">
function getScrollbarSize() {
// Create an Outer scrolling div
var dv = document.createElement('div');
dv.style.position = 'absolute';
dv.style.left = '-1000px';
dv.style.top = '-1000px';
dv.style.width = '100px';
dv.style.height = '100px';
dv.style.padding = '0px';
dv.style.margin = '0px';
dv.style.overflow = 'scroll';
dv.style.border = '0px';
// Attach it to the DOM document.body.appendChild(dv);
// Inner div to deform the scrolling div and create a scroll bar
var inn = document.createElement('div');
inn.style.position = 'relative';
inn.style.border = '0px';
inn.style.height = '200px';
inn.style.padding = '0px';
inn.style.margin = '0px';
dv.appendChild(inn);
var scrollbarWidth = 100-inn.offsetWidth;
document.body.removeChild(dv);
return {scrollbarSize:scrollbarWidth};}
function reportOnScrollbars() {
var geo = getScrollbarSize();
var res = "Scroll Bar Size: " + geo.scrollbarSize + "<br />";
document.getElementById('results').innerHTML = res;
}
</script>
<body onload="reportOnScrollbars()">
<div id="results">
</div>
</body>
</html>
IE Google Chrome Mozilla Firefox 亲测可用 大致思路是在一个小div里套一个大的div
那么小div自然就会出滚动条 然后用小div的宽度(此例中是100)减去大div的可见宽度就是滚动条的宽度 这是一本外国js大牛写的书里面教的方法
我在此基础上依据他的思路改进了一下 但是我写的方法只在 IE8 Google Chrome Mozilla Firefox 下测过
<html>
<head>
<title>Scroll Bar Size</title>
</head>
<script type="text/javascript">
function getScrollbarSize() {
var dv = document.createElement('div');
dv.style.overflow= "scroll";
dv.style.position = 'absolute';
dv.style.left = '-1000px';
dv.style.top = '-1000px';
dv.style.width = "100px";
document.body.appendChild(dv);
var bar_size = 100 - dv.scrollWidth;
document.body.removeChild(dv);
return bar_size;
}
</script>
<body onload="alert('bar size:' + getScrollbarSize());">
<div id="results">
</div>
</body>
</html>
希望对你有所帮助 也期待有哪位提供更好的方法 不用操作添加dom 直接根据属性算出来的
而且浏览器兼容性好的
<head>
<title>Scroll Bar Size</title>
</head><script type="text/javascript">
function getScrollbarSize() {
// Create an Outer scrolling div
var dv = document.createElement('div');
dv.style.position = 'absolute';
dv.style.left = '-1000px';
dv.style.top = '-1000px';
dv.style.width = '100px';
dv.style.height = '100px';
dv.style.padding = '0px';
dv.style.margin = '0px';
dv.style.overflow = 'scroll';
dv.style.border = '0px';
// Attach it to the DOM document.body.appendChild(dv);
// Inner div to deform the scrolling div and create a scroll bar
var inn = document.createElement('div');
inn.style.position = 'relative';
inn.style.border = '0px';
inn.style.height = '200px';
inn.style.padding = '0px';
inn.style.margin = '0px';
dv.appendChild(inn);
var scrollbarWidth = 100-inn.offsetWidth;
document.body.removeChild(dv);
return {scrollbarSize:scrollbarWidth};}
function reportOnScrollbars() {
var geo = getScrollbarSize();
var res = "Scroll Bar Size: " + geo.scrollbarSize + "<br />";
document.getElementById('results').innerHTML = res;
}
</script>
<body onload="reportOnScrollbars()">
<div id="results">
</div>
</body>
</html>
IE Google Chrome Mozilla Firefox 亲测可用 大致思路是在一个小div里套一个大的div
那么小div自然就会出滚动条 然后用小div的宽度(此例中是100)减去大div的可见宽度就是滚动条的宽度 这是一本外国js大牛写的书里面教的方法
我在此基础上依据他的思路改进了一下 但是我写的方法只在 IE8 Google Chrome Mozilla Firefox 下测过
<html>
<head>
<title>Scroll Bar Size</title>
</head>
<script type="text/javascript">
function getScrollbarSize() {
var dv = document.createElement('div');
dv.style.overflow= "scroll";
dv.style.position = 'absolute';
dv.style.left = '-1000px';
dv.style.top = '-1000px';
dv.style.width = "100px";
document.body.appendChild(dv);
var bar_size = 100 - dv.scrollWidth;
document.body.removeChild(dv);
return bar_size;
}
</script>
<body onload="alert('bar size:' + getScrollbarSize());">
<div id="results">
</div>
</body>
</html>
希望对你有所帮助 也期待有哪位提供更好的方法 不用操作添加dom 直接根据属性算出来的
而且浏览器兼容性好的
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
为毛不直接把滚动条去掉？overflow-y:hidden; overflow-x:hidden;这样不会出现滚动条，你宽度也不用去用js计算的那么精确了。
追问
故意叫他出现滚动条，内容太多了
追答
哦这样啊。。。parseInt(demo.offsetWidth)-parseInt(demo.scrollWidth)你是不是那个符号弄错了。。。。给你的div设置个id 然后把demo改为你那个id试试
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
滚动条宽度：22px
追问
这个不是固定的吧
追答
应该是固定的
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
