このコードは私がオリジナルで作成したものではありません。最近、美しいポップアップ ウィンドウの作成方法を学びたかったのですが、その書き方がわからなかったので、オンラインで検索したところ、非常にシンプルで良いものであることがわかりました。そして実践的で素晴らしいです。より論理的で読みやすいものにするために変更しました。 オリジナルの著者はもう利用できません。原作者アーメンに感謝します。 コードをコピー コードは次のとおりです: 弹出窗口登录效果 <br> body,#Mdown {<br> margin: 0;<br> padding: 0;<br> text-align: center;<br> font: normal 14px/180% Tahoma,sans-serif;<br> }<br> #loginBox {<br> margin: 0 auto;<br> padding: 0px;<br> text-align: left;<br> width: 280px;<br> height: 150px;<br> background: #EAEEFF;<br> font-size: 9pt;<br> border: 1px solid #829AFF;<br> overflow: hidden;<br> filter: alpha(opacity=90);<br> opacity: 1;<br> }<br> #loginBox .title {<br> text-align: left;<br> padding-left: 10px;<br> font-size: 11pt;<br> border-bottom: 1px solid #829AFF;<br> height: 25px;<br> line-height: 25px;<br> cursor: move;<br> }<br> #loginBox .t1 {<br> float: left;<br> font-weight: bold;<br> color: #AA7B7B;<br> text-decoration: none;<br> }<br> #loginBox .t2 {<br> float: right;<br> text-align: center;<br> line-height: 18px;<br> height: 18px;<br> width: 18px;<br> margin-top: 3px;<br> margin-right: 2px;<br> overflow: hidden;<br> border: 1px solid #FF5889;<br> background: #FFE0E9;<br> cursor: pointer;<br> }<br> #loginBox .login {<br> text-align: center;<br> width: 100%;<br> height: 100%;<br> }<br> input.submit {<br> float: right;<br> border: 1px solid #829AFF;<br> FONT-SIZE: 9px;<br> background: #EAEEFF;<br> HEIGHT: 20px;<br> margin-top: 5px;<br> margin-right: 70px;<br> }<br> #bgDiv {<br> width: 100%;<br> height: 100%;<br> position: absolute;<br> top: 0px;<br> left: 0px;<br> right: 0px;<br> background-color: #777;<br> opacity: 0.7;<br> }<br> 登录 登录 X < ;td>用户名: < /tr> 密: 登陆 <br> var IsMousedown, LEFT, TOP, login;<br><br> document.getElementById("Mdown") .onmousedown=function(e) {<br> login = document.getElementById("loginBox");<br> IsMousedown = true;<br> e = e||event;<br> LEFT = e.clientX - parseInt( login.style.left);<br> TOP = e.clientY - parseInt(login.style.top);<br><br> document.onmousemove = function(e) {<br> e = e||even; <br> if (IsMousedown) {<br> login.style.left = e.clientX - LEFT "px";<br> login.style.top = e.clientY - TOP "px";<br> }<br> }<br><br> document.onmouseup=function(){<br> IsMousedown=false;<br> }<br> }<br>