Tip: You can modify some of the code before running
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; Charset=utf-8 "/> <title> compatible ie6,ie7 javascript drag layer effect </title> <script language=" JavaScript "> function Alertwin (title, MSG, W, h) {var s=document.getelementsbytagname ("select");//--------------Catch all Select tags for ( var j=0;j<s.length;j++) {s[j].style.display= "none";}//--------------set to not display, then do the following var titleheight = "22px"; Prompt window title height var bordercolor = "#666699"; Hint window border color var titlecolor = "#FFFFFF"; Hint window title color var titlebgcolor = "#666699"; Hint window title background color var bgcolor = "#FFFFFF"; The background color of the hint content var iwidth = document.documentElement.clientWidth; var iheight = document.documentElement.clientHeight; var bgobj = document.createelement ("div"); BgObj.style.cssText = "Position:absolute;left:0px;top:0px;width:" +iwidth+ "Px;height:" +math.max (Document.body.clientHeight, iheight) + "Px;filter:alpha (opacity=30); opacity:0.3; Background-color: #000000; z-index:101; "; Document.body.appendChild (Bgobj); var msgobj=document.createelement ("div"); MsgObj.style.cssText = "position:absolute;font:11px ' song Body"; Top: "+ (iheight-h)/2+" Px;left: "+ (IWIDTH-W)/2+" Px;width: "+ w+ "Px;height: +h+" px;text-align:center;border:1px solid "+bordercolor+" Background-color: "+bgcolor+";p adding:1px ; line-height:22px;z-index:102; "; Document.body.appendChild (Msgobj); var table = document.createelement ("table"); Msgobj.appendchild (table); Table.style.cssText = "margin:0px;border:0px;padding:0px;"; table.cellspacing = 0; var tr = Table.insertrow (-1); var titlebar = Tr.insertcell (-1); TitleBar.style.cssText = "Width:100%;height:" +titleheight+ "Px;text-align:left;padding:3px;margin:0px;font:bold 13px ' song body '; color: "+titlecolor+"; border:1px solid "+ bordercolor +"; Cursor:move;background-color: "+ titlebgcolor; TitleBar.style.paddingLeft = "10px"; titlebar.innerhtml = title; var MoveX = 0; var movey = 0; var movetop = 0; var moveLeft = 0; var moveable = false; var docmousemoveevent = Document.onmousemove; var docmouseupevent = Document.onmouseup; Titlebar.onmousedown = function () {var evt = getEvent (); moveable = true; MoveX = Evt.clientx; Movey = Evt.clienty; Movetop = parseint (msgObj.style.top); MoveLeft = parseint (msgObj.style.left); Document.onmousemove = function () {if (moveable) {var evt = getEvent (); var x = moveLeft + Evt.clientx-movex; var y = movetop + Evt.clienty-movey; if (x > 0 && (x + W < iwidth) && y > 0 && (y + H < iheight)) {MsgObj.style.lef t = x + "px"; MsgObj.style.top = y + "px"; } } }; Document.onmouseup = function () {if (moveable) {document.onmousemove = docmousemoveevent; Document.onmouseup = docmouseupevent; moveable = false; MoveX = 0; Movey = 0; Movetop = 0; MoveLeft = 0; } }; var closebtn = Tr.insertcell (-1); CloseBtn.style.cssText = "Cursor:pointer; Padding:2px;background-color: "+ titlebgcolor; closebtn.innerhtml = "<span +titlecolor+"; >x</span> "; Closebtn.onclick = function () {for (Var j=0;j<s.length;j++) {s[j].style.display= ";}//--------------Select again Document.body.removeChild (Bgobj); Document.body.removeChild (Msgobj); var MsgBox = Table.insertrow ( -1). InsertCell (-1); MsgBox.style.cssText = "font:10pt ' song Body ';"; Msgbox.colspan = 2; msgbox.innerhtml = msg; Get event Events object for compatibility with IE and Firefox function getEvent () {return window.event | | arguments.callee.caller.arguments[0]; } </script> </pead> <body> <input type= "button" value= "dot Here" onclick= "Alertwin (' title ', ' Here is content ', 300 ); "/> <select> <option> Event object, for </opation> </select> </body> </ptml>
Tip: You can modify some of the code before running
