鶏口牛後な日々 〜へっぽこPHPエンジニアの発散の記録〜

PHPエンジニアを目指して奮闘中、でもブログは発散中

jQueryのwidth(), innerWidth(), outerWidth()の違い

jQueryでwindow幅ごとに処理を書き分けるというのを書きましたが、その時に、widthとinnerWidthって何が違うの? と思ったので、調べてみたことを書いておきます。

結論から言うと、以下の図の通りのようです。

f:id:TACOSVilledge:20180417133616p:plain


しかし、①window.width(), ②window.innerWidth(), ③window.outerWidth()でconsole.logしてみたところ、
①=0, ②=③でした。なので、上記のwindow幅で処理を書き分けるコードを書いたときは、特に使い分けする必要がなかったので、innerWidthで書きました。

ただ、細かく調べたわけではないので、一度console.logで出力してみて確認してから使い分けた方が良さそうです。