如何可靠地获取屏幕宽度与滚动条 [英] How to reliably get screen width WITH the scrollbar

查看:81
本文介绍了如何可靠地获取屏幕宽度与滚动条的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

有没有办法可靠地告诉浏览器的视口宽度,包括滚动条,而不是其余的浏览器窗口)?



列出的所有属性这里告诉我屏幕的宽度INCLUDING滚动条(如果有的话)

解决方案

只要body是100%, document.body.scrollWidth p>

演示: http://jsfiddle.net/ThinkingStiff/5j3bY /



HTML:

 < div id =width>< / div> 

CSS:

 code> body,html 
{
margin:0;
padding:0;
width:100%;
}

div
{
height:1500px;
}

脚本:

  var spacious ='viewport width(body.scrollWidth):'
+ document.body.scrollWidth +'< br />'
+'窗口。 innerWidth:'+ window.innerWidth +'< br />';

document.getElementById('width').innerHTML = wides;

我在演示中放了一个高的div来强制滚动条。


Is there a way to reliably tell a browser's viewport width that includes the scrollbar, but not the rest of browser window)?

None of the properties listed here tell me the width of the screen INCLUDING the scrollbar (if present)

解决方案

As long as body is 100%, document.body.scrollWidth will work.

Demo: http://jsfiddle.net/ThinkingStiff/5j3bY/

HTML:

<div id="widths"></div>

CSS:

body, html
{
margin: 0;
padding: 0;
width: 100%;
}

div
{
height: 1500px;
}

Script:

var widths = 'viewport width (body.scrollWidth): ' 
    + document.body.scrollWidth + '<br />'
    + 'window.innerWidth: ' + window.innerWidth + '<br />';

document.getElementById( 'widths' ).innerHTML = widths;

I put a tall div in the demo to force a scroll bar.

这篇关于如何可靠地获取屏幕宽度与滚动条的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆