この記事では、JSによるページにDVを実装する効果について説明します。次のように、参照のために共有してください。
<style type = "text/css"> body {margin：0px;}＃div1 {display：none;位置：絶対; z-index：1000;高さ：100％;幅：100％;背景：＃000000;フィルター：alpha（不透明= 30）;}＃div2 {display：none;位置：絶対;高さ：100％;幅：100％;パディングトップ：10％; z-index：1001;}＃div3 {display：block;位置：絶対; z-index：999;} </style> <スクリプトタイプ= "text/javascript"> //移動するオブジェクトと移動座標var mouse_obj = "none"、_ x、_y; // drag object（automatic）document.onmousemove = function（）{if（mouse_obj！== "none"）{ document.getElementById（Mouse_obj）.style.Left = _x+event.x; document.getElementById（Mouse_obj）.style.top = _y+event.y; event.returnValue = false; }} //ドラッグ機能（自動的に）document.onmouseup = function（）{mouse_obj = "none";} //ドラッグされたオブジェクト関数oがドラッグされたオブジェクト関数m（o）{mouse_obj = o; _x = parseint（document.getElementById（mouse_obj）.style.left）-event.x; _y = parseint（document.getElementbyid（mouse_obj）.style.top）-event.y;} </script> <divid = "div1"> </div> <div = "div2" onmousedown = "m（this.id）" style = "left：0px;"> <tellpadding = "3 ＃ff7300; position：static; filter：progid：dimbyagetransform.microsoft.dropshadow（color =＃666666、offx = 4、offy = 4、positives = true） "align =" left "> <tr style =" cursor：move; "> <td> <font" align = "right"> <input type = "button" value = "x" onclick = "document.getElementById（ 'div1'）。style.display = 'none'; document.getElementById（ 'div2'）。style.display = 'none';" style = "cursor：hand;"> </td> </tr> <td colspan = "2" bgcolor = "＃ffffff" align = "middule"> <a href = "// www.vevb.comへようこそ"> // www.vevb.com </a> value = "open layer" onclick = "document.getElementById（ 'div1'）。style.display= 'block'; document.getElementById（ 'div2'）。style.display = 'block';"> </div>JavaScript関連のコンテンツの詳細については、このサイトのトピックをご覧ください：「JavaScriptの切り替え効果とテクニックの要約」、「JavaScript検索アルゴリズムスキルの要約」、「JavaScriptアニメーション効果とテクニックの概要」、「Javascriptエラー、および「Javascriptデータ構造」の概要」の概要の要約の要約をご覧ください。 JavaScriptトラバーサルアルゴリズムとテクニック」、および「JavaScriptの数学的操作の使用法の要約」
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。