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

问题描述

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

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)

推荐答案

只要 body 为 100%，document.body.scrollWidth 就会起作用.

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

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

HTML:

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

CSS:

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

div
{
height: 1500px;
}

脚本:

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

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

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

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

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