Result jQuery //クリックイベント $("#showoverlay").click(function() { //オーバーレイ用のボックスを作成 $("body").append("<div id='overlay'></div>"); //フェードエフェクト $("#overlay").fadeTo(500, 0.7); $("#modalbox").fadeIn(500); }); //閉じる際のクリックイベント $("#close").click(function() { $("#modalbox, #overlay").fadeOut(500, function() { $("#overlay").remove(); }); }); $(window).resize(function() { //ボックスサイズ $("#modalbox").css({ top: ($
![シンプルなモーダルウィンドウ - かちびと.net](https://cdn-ak-scissors.b.st-hatena.com/image/square/4b2ef35a36765b6591cd58fa817af584f4c23cfb/height=288;version=1;width=512/https%3A%2F%2Fkachibito.net%2Fwp-content%2Fuploads%2F2024%2F07%2Fsiteimg.png)