本文へ移動
Webstudio YAS
  • About
  • Price
  • Work
  • Blog
  • Contact
  • About
  • Price
  • Work
  • Blog
  • Contact
  1. ホーム
  2. Blog
  3. JavaScriptでウィンドウサイズを取得して全画面表示

公開日: 2019.08.16

JavaScriptでウィンドウサイズを取得して全画面表示

JavaScriptでウィンドウサイズを取得して全画面表示

通常は、CSSで、width: 100vw; height: 100vh;とすれば、その要素は全画面になりますが、これをjavascriptで行いたい時があったので、メモ。

$(window).on('load resize', function(){
	// 幅取得
	var wSize = $(window).width();
	// 高さ取得
	var hSize = $(window).height();
	// サイズを変更
	$('#hoge').css({'width': wSize});
	$('#hoge').css({'height': hSize});
});

注)Jquery使用

タグ

  • css
  • JavaScript
  • ウィンドウサイズ
  • スタイルシート
  • 全画面表示
  • 取得

関連記事

2019.06.09

ページ読み込み後に実行する関数の違い一覧(JavaScriptとjQuery)

ページ読み込み後に実行する関数の違い一覧(JavaScriptとjQuery)

2019.11.25

【超簡単】Masonryの使い方と最低限の実装方法

【超簡単】Masonryの使い方と最低限の実装方法

2021.05.07

【jQuery】スマホのロングタップ(長押し)イベントの実装

【jQuery】スマホのロングタップ(長押し)イベントの実装
Webstudio YAS
  • About
  • Price
  • Work
  • Blog
  • Contact
YAS プロフィール画像

長野県長野市在住
WEBエンジニア YAS

LINKS

  • X
  • Instagram
  • GitHub
Design
  • スタンダード
  • 和モダン
  • エンジニア
  • 信州ナチュラル
プライバシーポリシー

@ Webstudio YAS