JavaScript imitates MsgBox Hint Effect code _javascript tips

Copy Code code as follows:

Former author: http://www.moozi.net
Modification: hh13774978@126.com,rayking
function $ (str) {
return document.getElementById (str);
}
function _ (str) {
return document.getElementsByTagName (str);
}
function msg (boxtitle,boxtype,boxwidth,msg,url) {
$ ("Msg_div_main"). Style.width = Boxwidth;
$ ("Msg_div_main"). Style.left = (_ ("Body") [0].clientwidth-boxwidth)/2;
$ ("Msg_div_main"). Style.top = (_ ("Body") [0].clientheight-220)/2;
var msg_div_main_but_tmp = "<br/><br/>"
+ "<button class= ' msg_div_main_but ' id= ' msg_div_main_but '"
+ "onclick=\" Msg_close_tmp_biyuan (); "+ URL +" \ "> OK </button>";
Switch (Boxtype * 1) {
Case 1:
$ ("Msg_div_main_content"). InnerHTML = msg + msg_div_main_but_tmp;
$ ("Msg_div_main_but"). focus ();
Break
Case 2:
$ ("Msg_div_main_content"). InnerHTML = msg + msg_div_main_but_tmp
+ "<button class= ' msg_div_main_but '"
+ "onclick= ' Msg_close_tmp_biyuan" (); ' > Cancel </button> ";
$ ("Msg_div_main_but"). focus ();
Break
Case 3:
$ ("Msg_div_main_content"). InnerHTML = msg;
Break
Defualt:
$ ("Msg_div_main_content"). InnerHTML = msg;
Break
}
$ ("Msg_div_main_title"). InnerHTML = Boxtitle;
$ ("Msg_div_main"). Style.zindex = 200;
$ ("Msg_div_main"). Style.display = "";
if (document.all) {//ie
if (!$ ("Msg_div_all_iframe"))
{
Document.body.appendChild (Document.createelement ("<iframe id= ' msg_div_all_iframe ' style= ' display:none; ') ></iframe> "));
}
$ ("Msg_div_all"). Style.zindex = 100;
$ ("Msg_div_all"). Style.display = "";
$ ("Msg_div_all"). OnContextMenu = function ()
{
return false;
}
$ ("Msg_div_all_iframe"). Style.zindex = 99;
$ ("Msg_div_all_iframe"). Style.display = "";
$ ("Msg_div_all_iframe"). OnContextMenu = function ()
{
return false;
}
}else{
$ ("Msg_div_all"). Style.zindex = 100;
$ ("Msg_div_all"). Style.display = "";
$ ("Msg_div_all"). OnContextMenu = function ()
{
return false;
}
}
$ ("Msg_div_main"). OnContextMenu = function () {
return false;
}
}
function Msg_close_tmp_biyuan () {
$ (' Msg_div_all '). style.display= ' None ';
$ (' Msg_div_main '). style.display= ' None ';
if (document.all) {
$ (' Msg_div_all_iframe '). style.display= ' None ';}
}
Add dialog box Move code
/* Mouse Drag * *
var Odrag = "";
var ox,oy,nx,ny,dy,dx;
function drag (e,o) {
var e = e? E:event;
var moused = document.all? 1:0;
if (E.button = = moused)
{
if (O.parentnode)
{
Odrag = O.parentnode;
}
Else{odrag = o;}
Ox = E.clientx;
Oy = E.clienty;
}
}
function Dragpro (e) {
if (Odrag!= "")
{
var Obj=document.getelementbyid ("msg");//Drag ID
ID dragged by Var obj=odrag;//
var e = e? E:event;
obj.style.position = ' absolute ';
DX = parseint (obj.style.left);
DY = parseint (obj.style.top);
if (isNaN (dx)) {dx=0}
if (isNaN (dy)) {dy=0}
NX = E.clientx;
NY = E.clienty;
Obj.style.left = (dx + (NX-OX)) + "px";
Obj.style.top = (dy + (Ny-oy)) + "px";
Ox = NX;
Oy = NY;
}
}
Document.onmouseup = function () {Odrag = "";}
Document.onmousemove = function (event) {Dragpro (event);}
Document.writeln ("<style type= ' text/css ' >")
+ "#msg_div_all, #msg_div_all_Iframe {width:100%;height:100%;p osition:absolute;filter:alpha (opacity=70); opacity:0 .7;background: #EFEFEF;} "
+ "#msg_div_main {position:absolute;}"
+ "#msg_div_main_title {font-size:12px;color: #2C71AF; font-family:verdana;cursor:default;}"
+ "#msg_div_main_content {font-size:14px;color: #2C71AF;p adding-left:8px;}"
+ ". Msg_div_main_but {Background:url (img/buttonbg.gif); width:65px;heigt:20px;border:none;padding-top:3px; font-size:12px;} "
+ "</style>"
+ "<div id= ' msg_div_all ' style= ' Display:none;" ></div> "
+""
+ "<div id= ' msg_div_main ' style= ' Display:none;" > "
+ <table width= ' 100% ' height= ' border= ' 0 ' cellspacing= ' 0 ' cellpadding= ' 0 ' onmousedown= ' drag (event,this) ' > '
+ "<tr>"
+ "<td width= ' ></td><td '" Img/bg_02.gif ' width= ' 3 ' ></td> '
+ "<td background= ' img/bg_02.gif ' msg_forid= ' msg_div_main ' id= ' msg_div_main_title ' ></td>"
+ "<td background= ' img/bg_02.gif ' align= ' right ' style= ' padding-top:4px ' >"
+ "+ "onmouseover=\" this.src= ' img/bg_13.gif ' "
+ "onmouseout=\" this.src= ' img/bg_05.gif ' onmouseup= ' Msg_close_tmp_biyuan (); ' "
+ "onmousedown=\" this.src= ' img/bg_18.gif ' \ "></td>"
+ ' <td width= ' 6 ' ></td> '
+ "</tr>"
+ "</table>"
+ "<table width= ' 100% ' border= ' 0 ' cellspacing= ' 0 ' cellpadding= ' 0 ' >"
+ "<tr>"
+ "<td width= ' 3 ' background= ' img/bg_07.gif ' ></td>"
+ "<td bgcolor= ' #F7F7F7 ' align= ' center ' ><br/><span id= ' msg_div_main_content ' ></span><br /&GT;&LT;BR/></td> "
+ "<td width= ' 3 ' background= ' img/bg_08.gif ' ></td>"
+ "</tr>"
+ "<tr>"
+ ' <td width= ' 3 ' height= ' 3 ' ></td> '
+ "<td background= ' img/bg_11.gif ' ></td>"
+ "<td width= ' 3 ' height= ' 3 ' ></td>"
+ "</tr>"
+ "</table>"
+ "</div>");

Online Demo
Package download