Web制作で役立つメモをWEB MEMO LOG

2017.11.18

【JS】ブラウザの高さを自動で取得しCSSに設定する方法

フル画面やファーストビューでブラウザの高さいっぱいにビジュアルを表示したい場合、幅は「width:100%;」で設定できますが、ブラウザの高さを取得して、その値をCSSに反映する方法をメモメモ。

<script>
$(window).load(function() {
//画面高さ取得
h = $(window).height();
$(".full").css("min-height", h + "px");
});
$(window).resize(function() {
//画面リサイズ時の高さ取得
h = $(window).height();
$(".full").css("min-height", h + "px");
});
</script>

【参考】【jQuery】表示しているブラウザの高さを取得してCSSのheightに指定 | Webデザインラボ

About Site

同じことを何度も検索していたりするんで、検索して解決したことを残そうと思いまして。