（マイナス）スクロールバーなしで画面幅を取得するにはどうすればよいですか？

要素があり、垂直スクロールバーなし（！）の幅が必要です。

Firebugはボディの幅が1280pxであると教えてくれます。

これらはいずれもFirefoxで正常に動作します。

console.log($('.element').outerWidth() );
console.log($('.element').outerWidth(true) );

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

それらはすべて、私が探している値である1263pxを返します。

ただし、他のすべてのブラウザでは1280pxが表示されます。

垂直スクロールバーなし（！）で全画面幅を取得するクロスブラウザ方法はありますか？

.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 

次のように書くだけで、バニラJavaScriptを使用できます。

var width = el.clientWidth;

これを使用して、次のようにドキュメントの幅を取得することもできます。

var docWidth = document.documentElement.clientWidth || document.body.clientWidth;

出典：MDN

次のように、スクロールバーを含むウィンドウ全体の幅を取得することもできます。

var fullWidth = window.innerWidth;

ただし、これはすべてのブラウザでサポートされているわけではないため、フォールバックとして、docWidth上記のように使用し、スクロールバーの幅を追加することができます。

出典：MDN

ここで想定するいくつかの例であり、$elementあるjQuery要素は：

// Element width including overflow (scrollbar)
$element[0].offsetWidth; // 1280 in your case

// Element width excluding overflow (scrollbar)
$element[0].clientWidth; // 1280 - scrollbarWidth

// Scrollbar width
$element[0].offsetWidth - $element[0].clientWidth; // 0 if no scrollbar

これを試して ：

$('body, html').css('overflow', 'hidden');
var screenWidth1 = $(window).width();
$('body, html').css('overflow', 'visible');
var screenWidth2 = $(window).width();
alert(screenWidth1); // Gives the screenwith without scrollbar
alert(screenWidth2); // Gives the screenwith including scrollbar

このコードを使用すると、スクロールバーの有無にかかわらず、画面の幅を取得できます。ここでは、bodyスクロールバーがある場合とない場合のオーバーフロー値を変更して幅を取得しています。

スクロールバーなしで正しい幅と高さを取得する最も安全な場所は、HTML要素からです。これを試して：

var width = document.documentElement.clientWidth
var height = document.documentElement.clientHeight

ブラウザのサポートはかなりまともで、IE 9以降でサポートされています。OLD IEの場合、ここで説明する多くのフォールバックの1つを使用します。

私は同様の問題を経験し、width:100%;解決しました。この質問の答えを試してみたところ、このソリューションに<iframe>たどり着きました。ある種の複雑な関数を使用しないと、これらのjavascript測定ツールが不正確になるためです。100％にすることは、iframeでそれを処理する簡単な方法です。操作しているHTML要素が不明なため、問題についてはわかりません。

これらの解決策はどれもうまくいきませんでしたが、幅を取得してスクロールバーの幅を差し引くことで解決できました。ブラウザ間の互換性がどれほどかはわかりません。

これが私が使うものです

function windowSizes(){
    var e = window,
        a = 'inner';
    if (!('innerWidth' in window)) {
        a = 'client';
        e = document.documentElement || document.body;
    }
    return {
        width: e[a + 'Width'],
        height: e[a + 'Height']
    };  
}

$(window).on('resize', function () {
    console.log( windowSizes().width,windowSizes().height );
});