次のようにコードをコピーします。
<html>
<頭>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無題のドキュメント</title>
<style type="text/css">
<!--
*{font-size:12px;font-family:Verdana、Geneva、sans-serif;line-height:14px}
{色:#039}
a:ホバー{color:#f60}
.pop{位置:絶対;左:40%;上:40%;幅:300px;高さ:100px;背景:#eee;境界線:1px 実線 #ccc}
.pop_head{位置:相対;高さ:20px;背景:#ccc}
.pop_head a{位置:絶対;右:8px;行の高さ:20px;色:#000;テキスト装飾:なし}
.pop_head a:hover{color:#f60;text-decoration:none}
.pop_body{パディング:8px}
-->
</スタイル>
</head>
<本文>
<!--まずレイヤーを設定します:->
<div id="pop" style="display:none" onclick="show(event,'pop');">
<div><a href="javascript:void(0);" onclick="hide('pop')">閉じる</a></div>
<div>ご訪問いただきありがとうございます...</div>
</div>
<!--ポップアップレイヤーのボタン:-->
<a href="javascript:void(0);" onclick="show(event ,'pop');">ポップ ボタン</a>
<script type="text/javascript">
var URL = '#';
関数 show(evt,o){
evt.stopPropagation?evt.stopPropagation():evt.cancelBubble=true;
var o = document.getElementById(o);
o.style.display = "";
}
関数 Hide(o){
var o = document.getElementById(o);
o.style.display = "なし";
window.location = URL;
}
document.onclick=function(){hide('pop');}
</script>
</body>
</html>
要約:
1. ポップアップ メソッドを呼び出すときに、イベント オブジェクト、event を渡します。
2. イベント バインディング コードをポップアップ メソッドに追加します。
3. 他の部分をクリックしたときにポップアップレイヤーを非表示にするメソッドを呼び出すために使用されるグローバル js コードが必要です。