如何获取屏幕宽度没有（减）滚动条？(How to get screen width without (minus) scrollbar?)

如何获取屏幕宽度没有（减）滚动条？(How to get screen width without (minus) scrollbar?)

我有一个元素，需要它的宽度没有（！）垂直滚动条。

Firebug告诉我身体宽度是1280px。

在Firefox中都可以正常工作

console.log($('.element').outerWidth() ); console.log($('.element').outerWidth(true) ); $detour = $('.child-of-element').offsetParent(); console.log( $detour.innerWidth() );

他们都返回1263px ，这是我正在寻找的价值。

但是所有其他浏览器给我1280px 。

有没有（！）垂直滚动条的跨浏览器方式获得全屏宽度？

I have an element and need it's width without(!) vertical scrollbar.

Firebug tells me body width is 1280px.

Either of these work fine in Firefox:

console.log($('.element').outerWidth() ); console.log($('.element').outerWidth(true) ); $detour = $('.child-of-element').offsetParent(); console.log( $detour.innerWidth() );

They all return 1263px, which is the value I'm looking for.

However all other browser give me 1280px.

Is there a cross browser way to get a fullscreen width without(!) vertical scrollbar?

最满意答案

.prop("clientWidth")和.prop("scrollWidth")

var actualInnerWidth = $("body").prop("clientWidth"); // El. width minus scrollbar width var actualInnerWidth = $("body").prop("scrollWidth"); // El. width minus scrollbar width

在JavaScript中 ：

var actualInnerWidth = document.body.clientWidth; // El. width minus scrollbar width var actualInnerWidth = document.body.scrollWidth; // El. width minus scrollbar width

_{PS：请注意，为了可靠地使用scrollWidth元素不应该水平溢出}

jsBin演示

---

你也可以使用.innerWidth()但这只能在body元素上工作

var innerWidth = $('body').innerWidth(); // Width PX minus scrollbar

.prop("clientWidth") and .prop("scrollWidth")

var actualInnerWidth = $("body").prop("clientWidth"); // El. width minus scrollbar width var actualInnerWidth = $("body").prop("scrollWidth"); // El. width minus scrollbar width

in JavaScript:

var actualInnerWidth = document.body.clientWidth; // El. width minus scrollbar width var actualInnerWidth = document.body.scrollWidth; // El. width minus scrollbar width

_{P.S: Note that to use scrollWidth reliably your element should not overflow horizontally}

jsBin demo

---

You could also use .innerWidth() but this will work only on the body element

var innerWidth = $('body').innerWidth(); // Width PX minus scrollbar