Alert effects that improve the user experience

Today, in the classics, someone turned this effect on its own.

http://bbs.blueidea.com/thread-2688074-1-1.html

Like the Lightbox effect, or the moment before Windows shuts down the system, a dim background for highlighting themes is being used more and more in Web2.0 's site style.

(About Lightbox:http://www.cnbruce.com/blog/showlog.asp?cat_id=34&log_id=1005 )

Now, when the pop-up alert warning box is replaced by one such way, the feeling is quite fresh.

Such

<input type= "button" value= "click here"/>

<script type= "Text/javascript" language= "JavaScript" >
Author:daviv
Blog:http://blog.163.com/jxdawei
Date:2006-10-28
Email:jxdawei@gmail.com
function Salert (str) {
var Msgw,msgh,bordercolor;
msgw=400;//the width of the prompt window
msgh=100;//the height of the prompt window
Bordercolor= "#336699";//Hint window border color
Titlecolor= "#99CCFF";//Hint window title color

var swidth,sheight;
Swidth=document.body.offsetwidth;
Sheight=document.body.offsetheight;

var bgobj=document.createelement ("div");
Bgobj.setattribute (' id ', ' bgdiv ');
bgobj.style.position= "Absolute";
bgobj.style.top= "0";
Bgobj.style.background= "#777";
Bgobj.style.filter= "ProgidXImageTransform.Microsoft.Alpha" (style=3,opacity=25,finishopacity=75);
bgobj.style.opacity= "0.6";
bgobj.style.left= "0";
Bgobj.style.width=swidth + "px";
Bgobj.style.height=sheight + "px";
Document.body.appendChild (Bgobj);
var msgobj=document.createelement ("div")
Msgobj.setattribute ("id", "msgdiv");
Msgobj.setattribute ("Align", "center");
msgobj.style.position= "Absolute";
msgobj.style.background= "White";
Msgobj.style.font= "12px/1.6em Verdana, Geneva, Arial, Helvetica, Sans-serif";
Msgobj.style.border= "1px solid" + bordercolor;
MSGOBJ.STYLE.WIDTH=MSGW + "px";
MSGOBJ.STYLE.HEIGHT=MSGH + "px";
msgobj.style.top= (Document.documentElement.scrollTop + (SHEIGHT-MSGH)/2) + "px";
msgobj.style.left= (SWIDTH-MSGW)/2 + "px";
var title=document.createelement ("H4");
Title.setattribute ("id", "msgtitle");
Title.setattribute ("Align", "right");
title.style.margin= "0";
Title.style.padding= "3px";
Title.style.background=bordercolor;
Title.style.filter= "Progid:DXImageTransform.Microsoft.Alpha (startx=20, starty=20, finishx=100, finishy=100,style= 1,OPACITY=75,FINISHOPACITY=100); ";
Title.style.opacity= "0.75";
Title.style.border= "1px solid" + bordercolor;
Title.style.height= "18px";
Title.style.font= "12px Verdana, Geneva, Arial, Helvetica, Sans-serif";
title.style.color= "White";
title.style.cursor= "Pointer";
Title.innerhtml= "Close";
Title.onclick=function () {
Document.body.removeChild (Bgobj);
document.getElementById ("Msgdiv"). RemoveChild (title);
Document.body.removeChild (Msgobj);
}
Document.body.appendChild (Msgobj);
document.getElementById ("Msgdiv"). AppendChild (title);
var txt=document.createelement ("P");
Txt.style.margin= "1em 0"
Txt.setattribute ("id", "msgtxt");
TXT.INNERHTML=STR;
Doc

To make a script into a JS file on it.