この記事では、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プログラミングに役立つことを願っています。