WordPressでレスポンシブタイプのテーマのCSS編集をしている時、現在のウィンドウサイズを確認するために、Media Queries のブレイクポイント前後でブラウザ機能の「要素を調査」や「Firebug」などを使っていたのですが、複数の幅をリアルタイムに一度にチェックできたらいいなと思っていました。 そこで、現在の画面サイズを動的に表示する簡単なスクリプトを作りましたので紹介します。 動作サンプル ブラウザの画面を横へ大きくしたり小さくしたりすると数値が変わります。 jQueryコードを設置 以下のコードを header.php の 一番下に張り付けてください。 ウィジェットの「テキスト(任意のテキストや HTML)」に張り付けても動作します。 <div class="window_size">window</div> <script type="text/javascript">
![WordPressレスポンシブテーマのCSS編集に役立つ「現在のウィンドウサイズを表示する」スクリプト](https://cdn-ak-scissors.b.st-hatena.com/image/square/131c2a4830614ee49ce6590615b01e20243bb37d/height=288;version=1;width=512/https%3A%2F%2Fnendeb.com%2Fwp-content%2Fuploads%2Fwindow_width02-1024x539.png)