唐突にJavaScriptの解説が始まる

「実在するwebページのスクショを見ながら自分でコードを書いて再現する実習」は、まだ続いている。
今日は「レスポンシブ対応をして下さい」と言われる。
ブラウザの横幅を狭くしたら、コンテンツの並び方を変えねばならない。
要は「スマホ対応」である。パソコンの大画面で見たままのデザインをスマホで表示したら読みにくいことは想像が付くだろう。

スマホ対応のために用いられる仕掛けに、「ハンバーガーメニュー」がある。
どういうものであるかはこちらのページに詳しい。また、このページもブラウザの横幅を狭くするとハンバーガーメニューが右上に現れる。

【NTT西日本】ハンバーガーメニュー｜ICT用語集｜法人・ 企業向け ICT サービス ・ ソリューション

これを実装するにはHTMLとCSSだけでは足りない。
プログラム言語「JavaScript」の出番となる。
先生は強調して言った。
「『Java』と『JavaScript』は別物です。JavaScirptを略してJavaと言わないように」

三本線のアイコンをクリック(タップ)するとサブメニューが横からにゅっとせり出してくる(そしてxアイコンをクリックしたら引っ込む)、この仕組みを学んだ。

webページにこの程度の「動き」を実装するために、知るべき事はそう多くない。「端から端まで勉強しなくてもいいです」と先生。
まあ、必要になったらググればサンプルコードがいくらでも入手できるし。

今後の実習でも使うことになるだろうから、ちゃんと理解しておこう。