以下是 js模仿MSN弹出对话框特效代码 的示例演示效果:
部分效果截图:

HTML代码(index.html):
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>abc</title>
    <meta http-equiv=Content-Type content="text/html; charset=gb2312">
    <script language=Javascript src="js/msn.js"></script>
</head>
<body style="MARGIN: 0px; TEXT-ALIGN: center">
    <table width="778" height="153" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
        <tr>
            <td> </td>
        </tr>
    </table>
    <table width="778" height="1030" border="0" cellpadding="0" cellspacing="0" bgcolor="F4F4F4">
        <tr>
            <td height="1030"> </td>
        </tr>
    </table>
</body>
</html>JS代码(msn.js):
document.writeln("<div id=\"msn\" style=\"BORDER-RIGHT:#455690 1px solid;
	BORDER-TOP:#a6b4cf 1px solid;
	Z-INDEX:99999;
	LEFT:0px;
	BORDER-LEFT:#a6b4cf 1px solid;
	WIDTH:180px;
	BORDER-BOTTOM:#455690 1px solid;
	POSITION:absolute;
	TOP:0px;
	HEIGHT:116px;
	BACKGROUND-COLOR:#c9d3f3\">");
	document.writeln("<table width=\"100%\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"BORDER-TOP:#ffffff 1px solid;
	BORDER-LEFT:#ffffff 1px solid\" bgcolor=\"#cfdef4\">");
	document.writeln("<tr><td height=\"24\" width=\"26\" style=\"FONT-SIZE:12px;
	BACKGROUND-IMAGE:url(images/msgTopBg.gif);
	COLOR:#0f2c8c\" valign=\"middle\"><img src=\"images/msgLogo.gif\" hspace=\"5\" align=\"absMiddle\" vspace=\"1\"\/><\/td>");
	document.writeln("<td style=\"FONT-WEIGHT:normal;
	FONT-SIZE:9pt;
	BACKGROUND-IMAGE:url(images/msgTopBg.gif);
	COLOR:#1f336b;
	PADDING-TOP:4px\" valign=\"middle\" width=\"100%\">�ز�<\/td>");
	document.writeln("<td style=\"BACKGROUND-IMAGE:url(images/msgTopBg.gif);
	PADDING-TOP:2px\" valign=\"middle\" width=\"19\" align=\"right\"><img src=\"images/msgClose.gif\" hspace=\"3\" style=\"CURSOR:pointer\" onclick=\"closeDiv()\" title=\"�ر�\"\/><\/td>");
	document.writeln("<\/tr><tr><td colspan=\"3\" height=\"90\" style=\"PADDING-RIGHT:1px;
	BACKGROUND-IMAGE:url(images/msgBottomBg.jpg);
	PADDING-BOTTOM:1px\">");
	document.writeln("<div style=\"BORDER-RIGHT:#b9c9ef 1px solid;
	PADDING-RIGHT:13px;
	BORDER-TOP:#728eb8 1px solid;
	PADDING-LEFT:13px;
	FONT-SIZE:9pt;
	PADDING-BOTTOM:13px;
	BORDER-LEFT:#728eb8 1px solid;
	WIDTH:100%;
	COLOR:#1f336b;
	PADDING-TOP:18px;
	BORDER-BOTTOM:#b9c9ef 1px solid;
	HEIGHT:100%\"><a href=\"#\" target=\"_blank\" style=\"FONT-WEIGHT:bold;
	COLOR:red\">>
	>
	ͼ������<\/a><br><br><a href=\"#\" target=\"_blank\" style=\"FONT-WEIGHT:bold;
	COLOR:blue\">>
	>
	�����ز�<\/a><\/div><\/div><\/tr><\/table><\/div>");
	msn.style.top=document.body.clientHeight-174;
	msn.style.left=document.body.clientWidth-225;
	moveR();
	function moveR(){
	msn.style.top=document.body.scrollTop+document.body.clientHeight-116;
	msn.style.left=document.body.scrollLeft+document.body.clientWidth-180;
	setTimeout("moveR();
	",80)}
function closeDiv(){
	msn.style.visibility='hidden';
}
 
             
        