【JavaScript入門】モーダルウィンドウ - Qiita

はじめに Webサイトを作成する際、 ・ボタン、画像を押したときにポップアップする小ウィンドウを設置したい と思うことあると思います。 今回は、そんな機能についてご紹介します。 手順① 表示・非表示機能をつくる まずは、モーダルウィンドウの根幹となる表示・非表示の機能を作ります。 <form> <input type="button" id="openBtn" value="モーダル"> </form> <!-- モーダルウィンドウで表示する部分 --> <div id="modal" class="modal"> <div class="modal_content"> <h1>Hello</h1> <input type="button" id="closeBtn" value="閉じる"> </div> </div> <!-- モーダルウィンドウ --> <script> var op