この記事では、JS+CSSによるDraggable Popupプロンプトボックスの実装について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
次のようにコードをコピーします。
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<title> JS+CSS </title>によって作成されたドラッグ可能なポップアッププロンプトボックス
<style type = "text/css">
{color：＃000; font-size：12px;テキストゼロ：なし}
A：Hover {color：＃900;テキスト装置：下線}
body {background：; filter：progid：dmimagetransform.microsoft.gradient（gradienttype = 0、startcolorstr =＃ffffff、endcolorstr =＃003366）;オーバーフロー：隠し}
#massage_box {position：absolute;左：式（（body.clientwidth-350）/2）;上：式（（body.clientheight-200）/2）;幅：350px;高さ：200px;フィルター：Dropshadow（color =＃666666、offx = 3、offy = 3、陽性= 2）; z-index：2;可視性：隠し}
#mask {position：absolute;上：0;左：0;幅：式（body.scrollwidth）; height：expression（body.scrollheight）;背景：＃666;フィルター：アルファ（不透明度= 60）; z-index：1;可視性：隠し}
.MASSAGE {BORDER：＃036 SOLID;境界線：1 1 3 1;幅：95％;高さ：95％;背景：#ffff;色：＃036;フォントサイズ：12px;ラインハイト：150％}
.header {background：＃036;高さ：10％;フォントファミリー：Verdana、Arial、Helvetica、Sans-Serif;フォントサイズ：12px;パディング：3 5 0 5;色：#fff}
</style>
<！ - レイヤーの動きを実装 - >
<スクリプト言語= "javascript">
var obj = ''
document.onmouseup = mup
document.onmousemove = mmove
function mdown（object）{
object.id
document.all（obj）.setcapture（）
px = event.x-document.all（obj）.style.pixelleft;
py = event.y-document.all（obj）.style.pixeltop;
}
関数mmove（）{
if（obj！= ''）{
document.all（obj）.style.left = event.x-px;
document.all（obj）.style.top = event.y-py;
}
}
関数mup（）{
if（obj！= ''）{
document.all（obj）.releasecapture（）;
obj = '';
}
}
</script>
</head> <body>
<div id = "massage_box"> <div>
<div onmousedown = mdown（massage_box）>
<span onclick = "massage_box.style.visibility = 'hidden'; mask.style.visibility = 'hidden'" style = "float：right; display：inline; cursor：hand">×</span> </div>
</div> </div>
<div id = "mask"> </div>
<onclick = "mask.style.visibility = 'visible'; massage_box.style.visibility = 'visible'" style = "cursor：" cursor： "> <a href ="＃ "> <font size>このプロンプトをクリックします</font> </a> </span>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。