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下读出来的不正确
展开
 我来答
lzuhy
推荐于2016-11-05 · TA获得超过1131个赞
知道小有建树答主
回答量:179
采纳率:0%
帮助的人:193万
展开全部
<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 直接根据属性算出来的
而且浏览器兼容性好的
jy07sg
2013-01-08 · TA获得超过1044个赞
知道小有建树答主
回答量:930
采纳率:0%
帮助的人:732万
展开全部
为毛不直接把滚动条去掉?overflow-y:hidden; overflow-x:hidden;这样不会出现滚动条,你宽度也不用去用js计算的那么精确了。
追问
故意叫他出现滚动条,内容太多了
追答
哦这样啊。。。parseInt(demo.offsetWidth)-parseInt(demo.scrollWidth)你是不是那个符号弄错了。。。。给你的div设置个id  然后把demo改为你那个id试试
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2013-01-08
展开全部
额,问题解决了吗,
追问
没有呢  alert 不允许出现在代码里的,求助,不吝赐教
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
846564997
2013-01-08 · TA获得超过661个赞
知道小有建树答主
回答量:366
采纳率:0%
帮助的人:113万
展开全部
滚动条宽度:22px
追问
这个不是固定的吧
追答
应该是固定的
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 2条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式