https://www.takizawa.asia/js/top_modal.js

1//modal
2$(function(){
3	
4  //ƒeƒLƒXƒgƒŠƒ“ƒN‚ðƒNƒŠƒbƒN‚µ‚½‚ç
5	$("#modal-open").click(function(){
6	  //body“à‚̍Ōã‚É<div id="modal-bg"></div>‚ð‘}“ü
7		$("body").append('<div id="modal-bg"></div>');
8    
9    //‰æ–Ê’†‰›‚ðŒvŽZ‚·‚éŠÖ”‚ðŽÀs
10    modalResize();
11
12    //ƒ‚[ƒ_ƒ‹ƒEƒBƒ“ƒhƒE‚ð•\Ž¦
13		$("#modal-bg,#modal-main").fadeIn("slow");
14    
15    ////‰æ–Ê‚Ì‚Ç‚±‚©‚ðƒNƒŠƒbƒN‚µ‚½‚烂[ƒ_ƒ‹‚ð•Â‚¶‚é
16	//	$("#modal-bg,#modal-main").click(function(){
17	//		$("#modal-main,#modal-bg").fadeOut("slow",function(){
18	//			$('#modal-bg').remove() ;
19	//		});
20	//
21	//	});
22		
23	//ƒNƒ[ƒY‚ðƒNƒŠƒbƒN‚Ń‚[ƒ_ƒ‹‚ð•Â‚¶‚é
24	$("#modal-bg,#modal-close").unbind().click(function(){
25			$("#modal-main,#modal-bg").fadeOut("slow",function(){
26	      //‘}“ü‚µ‚½<div id="modal-bg"></div>‚ðíœ
27				$('#modal-bg').remove() ;
28			});
29	});
30    
31    //‰æ–ʂ̍¶ã‚©‚çmodal-main‚̉¡•E‚‚³‚ðˆø‚«A‚»‚Ì’l‚ð2‚ÅŠ„‚é‚Ɖæ–Ê’†‰›‚̈ʒu‚ªŒvŽZ‚Å‚«‚Ü‚·
32		$(window).resize(modalResize);
33		function modalResize(){
34	
35			var w = $(window).width();
36			var h = $(window).height();
37			
38			var cw = $("#modal-main").outerWidth();
39			var ch = $("#modal-main").outerHeight();
40      
41	    //Žæ“¾‚µ‚½’l‚ðcss‚ɒljÁ‚·‚é
42			$("#modal-main").css({
43              "left": ((w - cw)/2) + "px",
44              "top": ((h - ch)/2) + "px"
45          	});
46		}
47	});
48});