JS 弹出对话框 (遮罩) 透明, 可拖动的简单实例
<html> <head> <script> function salert (txt) {// var esrc = (document.all)? window.event.srcelement: argumen [1]; var shield = document.createElement ("div"); shield.id = "shield"; shield.style.position = "absolute"; shield.id = "shield"; shield.style.position = "absolute"; shield.id = "shield"; shield.style.position = "absolute"; shield.id = "shield"; shield.style.position = "absolute"; shield.id = "shield" "0px"; shield.style.width = "100%"; // window.alert (document.body.scrollheight); shield.style.height = document.body.scrollheight+"px"; shield.style.background = "white"; shield.style.textalign = "centyle. "10000"; shield.style.filter = "alpha (opacity = 80)"; shield.style.opacity = 0.8; // shield.style.border-width = tebal; strhtml = "<input type =/" Button/"value =/" 确 定/"id =/" DO_OK/"ON/" Nilai =/" />/n";shield.innerHTML = strHtml;document.body.appendChild(shield);this.doOk = function(){document.body.removeChild(shield);}document.getElementById("do_OK").focus();}</script></head><body ><input type=button onclick="sAlert('登陆成功！')" value = 登陆> <p align = center> <pilect> <pection> --- </pection> </folly> </p> </body> </html> <html> <head> <script> var dragapproved = falsevar minRestore = 0 // 该变量表示窗口目前的状态 ， 0 表示初始化状态 ， 1 表示最大化状态 var initialwidth, initialheight // 若 klien 浏览器为 ie5.0 以上版本的 var ie5 = document.all & document.getElementById/若 klien 浏览器为 netscape 6 版本以上的 浏览器为 document. iecompattest () {return (! window.opera && document.compatmode && document.compatmode! = "backcompat")? Document.DocumentElement: document.body} function drag_drop (e) {if (ie5 && dragapproved && event.button == 1) {document.geteLementById ("dwindow"). style.left = tempx+event.clientx-offsetx+"px" document.geteLementById ("dwindow"). style.top = bhiby+event.clienty-offsety+"px" (ns6 && dragApproved) {document.geteLementById ("dwindow"). style.left = tempx+e.clientx-offsetx+"px" document.getElementById ("dwindow"). style.top = tempy+e.clienty-offsety+"px"}} functionRag (e) {IE5? event.clientx: e.clientxoffsety = ie5? event.clienty: e.clientydocument.geteLementById ("dwindowcontent"). style.display = "none" // 此句代码可不要 tempx = parseInt (document.geteLementById ("dwindow"). Style.left) temppy = parseInt (document.geteLementById ("dwindow"). Style.top) dragapproved = truedocument.getElementById ("dwindow"). OnMouseMove = drag_drop} function} funche} funche {loadwindow ") (! IE5 &&! NS6) // 若不为 IE 或 netscpae 浏览器 ， 则使用一般的 window.open 进行弹出窗口处理 //window.open(url ,"" ,"width=width, height=height ,crollbars = 1 ") {} else {document.geteLementById (" dwindow "). Style.display = ''; document.geteLementById (" dwindow "). Style. width = initialwidth = width+"px"; document.geteLementById ("dwindow"). style.height = initialheight = height+"px"; document.geteLementById ("dwindow"). style.left = "300px"; document.getElementById ("dwindow"). style.top = "300px"; Document.getElementById ("Dwindow"). Style.top = TOGE = TOGE = TOPX = NSOUCTER6? window.pageyoffset*1+30+"px": iecompattest (). scrolltop*1+30+"px"; // document.geteLementById ("cframe"). src = url}} function maximize () {if (minRestore == 0) {minrestore = 1 // windowdocument.getElementById ("maxName"). setattribute ("src", "tata letak.png") document.geteLementById ("dwindow"). style.width = ns6? window.innerwidth-20+"px": iecompattest (). clientwidth+"px" document.geteLementById ("dwindow"). style.height = ns6? window.innerheight-20+"px": iecompattest (). clientheight+"px"} else {minRestore = 0 // kembalikan windowdocument.getElementById ("maxName"). setAttribute ("src", "tata letak.png") document.getElementById ("dwindow"). style.width = initialwidthdocument.getElementById ("dwindow"). style.height = initialheight} document.getylementyId ("dwindow"). style.height = document.linder} document. window.pagexoffset+"px": iecompattest (). scrollleft+"px" document.geteLementById ("dwindow"). style.top = ns6? window.pageyoffset+"px": iecompattest (). scrolltop+"px"} function closeit () {document.geteLementById ("dwindow"). style.display = "none"} function stopdrag () {dragApproved = false; document.geteLementById ("dwindow"). onmouseMove = null; document.geteLementById ("dwindowcontent"). style.display = "" // extra} </script> </head> <div id = "dwindow" style="position:absolute;background-color:#EBEBEB;cursor:hand;left:0px;top:0px;display:none" onMousedown="initializedrag(event)" onMouseup="stopdrag()" onSelectStart="return false"><div align="right" style="background-color:navy"><img src="layout.png" id = "maxName" ontClick = "Maximize ()"> <img src = "icon_delete.gif" onclick = "closeit ()"> </div> <div id = "dwindowcontent" style = "height: 100%"> </Div> </Div> <input type = "value" 弹出窗口 "弹出窗口" OnClick = 'LoadWindow (300.200);'> </body> </html>以上这篇 js 弹出对话框 (遮罩) 透明, 可拖动的简单实例就是小编分享给大家的全部内容了 ， 希望能给大家一个参考 ， 也希望大家多多支持武林网。