发一个自己做的一个类似msn的弹出窗口

    前段时间，由于项目的需要，要做一个类似msn登录时的弹出窗口。在网上转了一圈后，实验了几个方案，最后决定采用popup的方式。这中方式的特点实现起来比较简单，不需要去控制那么多东西，你只要维护好一个页面内容就行了。缺点就是没有跨平台性。尽管这样，我还是把他帖出来。一来，自家的孩子都不丑，好歹是自己弄出来的（当然参照了网友的一些东西）。二来，作为一个纪传史，好坏都要记，不能只记好的嘛，毕竟这也是一个经过嘛。三来，再简单的东西，对于有需要的人来说，也是有一定的参考价值，大不了让别人看了之后说一句：这东西真烂。在说这话的时候已经启迪人家的思维了，让人家想到怎么样能更好。鉴于以上三点，我好不犹豫的帖了出来。
    我的需求是，定时到后台去检索数据，如果有符合要求的数据，就弹出一个提示框，没有就不弹。
    //循环调用弹出窗口函数
    function circleExe(sound){
     soundUrl=sound || "sound/sound.wav";
     window.setInterval("formMessage();",60000);
    }
    //获取数据，这里调了一个ajax方法到后台取数据
    function formMessage(){ 
     var result = getMyNoReceiveNote(); 
     var v = result.split('$$');
     currentRecord = v[0];
     var num =0;
     if(currentRecord && currentRecord !=""){
       num = getInfoRecord(currentRecord);
     }
     if(num > 0 ){
      popmsg("您有<font color=#FF0000>"+num+"</font>个未查看的新文件");
     }
    }
    //这个乱乱的东西就是整个窗口。因为在里面加了很多样式，所以感觉很乱
    function popmsg(msg,sound){
 //var winstr="<DIV id=eMeng style='BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX:99999; LEFT: 0px; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: 200px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 0px; HEIGHT: 150px; BACKGROUND-COLOR: #c9d3f3'><TABLE style='BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid' cellSpacing=0 cellPadding=0 width='100%' bgColor=#cfdef4 border=0><TBODY><TR><TD style='FONT-SIZE: 12px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #0f2c8c' width=30 height=24></TD><TD style='FONT-WEIGHT: normal; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #1f336b; PADDING-TOP: 4px;PADDING-left: 4px' valign=middle width='100%'> 消息提示：</TD><TD style='BACKGROUND-IMAGE: url(msgTopBg.gif); PADDING-TOP: 2px;PADDING-right:2px' valign=middle align=right width=19><span title=关闭 style='CURSOR: hand;color:red;font-size:12px;font-weight:bold;margin-right:4px;' onclick='parent.closeDiv();' >×</span></TD></TR><TR><TD style='PADDING-RIGHT: 1px; BACKGROUND-IMAGE: url(1msgBottomBg.jpg); PADDING-BOTTOM: 1px' colSpan=3 height=90><DIV style='BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 13px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 13px; FONT-SIZE: 12px; PADDING-BOTTOM: 13px; BORDER-LEFT: #728eb8 1px solid; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 18px; BORDER-BOTTOM: #b9c9ef 1px solid; HEIGHT: 100%;'><DIV align=center style='word-break:break-all;font-size:14'>"+msg+"</DIV></DIV></TD></TR></TBODY></TABLE><DIV style='position:relative;top:6px;' align=center><input type='button' onclick='parent.viewInfo()' value='查看' style='border-style:solid;border-width:1px;BACKGROUND-COLOR: #c9d3f3'/>&nbsp;&nbsp;&nbsp;&nbsp;<input type='button' onclick='parent.ignore()' value='忽略' style='border-style:solid;border-width:1px;BACKGROUND-COLOR: #c9d3f3'/> </DIV></DIV>";
 var winstr="<DIV id=eMeng style='filter:progid:DXImageTransform.Microsoft.Gradient(gradienttype=0, startcolorstr=#ffffff, endcolorstr=#D9E8EB);background-position: right;background-repeat: repeat-y;border: 1px solid #C3DCE0;Z-INDEX:99999; LEFT: 0px;  WIDTH: 200px; POSITION: absolute; TOP: 0px; HEIGHT: 150px'><TABLE width='100%' border=0 cellPadding=0 cellSpacing=0 style='BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid'><TBODY><TR><TD  width=30 ></TD><TD valign=middle width='100%' style='filter:progid:DXImageTransform.Microsoft.Gradient(gradienttype=0, startcolorstr=#0E6DA6, endcolorstr=#8BC2DC);font-weight: bold;color: #FFFFFF;text-decoration: none;line-height: 16px;height: 22px;padding: 3px;font-size: 12px;'> 消息提示：</TD><TD  valign=middle align=right id='ttpop' width=19 style='filter:progid:DXImageTransform.Microsoft.Gradient(gradienttype=0, startcolorstr=#0E6DA6, endcolorstr=#8BC2DC);font-weight: bold;color: #FFFFFF;text-decoration: none;line-height: 16px;height: 22px;padding: 3px;font-size: 12px;'><span title=关闭  onclick='parent.closeDiv();' >×</span></TD></TR><TR><TD style='PADDING-RIGHT: 1px; BACKGROUND-IMAGE: url(1msgBottomBg.jpg); PADDING-BOTTOM: 1px' colSpan=3 height=90><DIV style='PADDING-RIGHT: 13px;  PADDING-LEFT: 13px; FONT-SIZE: 12px; PADDING-BOTTOM: 13px; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 18px;  HEIGHT: 100%;'><DIV align=center style='text-align: left;text-indent: 24px;line-height: 18px;color: #336699;font-size: 13px;'>"+msg+"</DIV></DIV></TD></TR></TBODY></TABLE><DIV style='' align=center><input type='button' style='line-height: 16px;color: #FFFFFF;text-decoration: none;filter:progid:DXImageTransform.Microsoft.Gradient(gradienttype=1, startcolorstr=#0E6DA6, endcolorstr=#8BC2DC);height: 22px;background-color: #B5D4E6;border: 1px solid #0C69A2;' onclick='parent.viewInfo()' value='查看' />&nbsp;&nbsp;&nbsp;&nbsp;<input type='button' style='line-height: 16px;color: #FFFFFF;text-decoration: none;filter:progid:DXImageTransform.Microsoft.Gradient(gradienttype=1, startcolorstr=#0E6DA6, endcolorstr=#8BC2DC);height: 22px;background-color: #B5D4E6;border: 1px solid #0C69A2;' onclick='parent.ignore()' value='忽略' /> </DIV></DIV>";
 oPopup.document.body.innerHTML = winstr;
 popshow();
 playSound(soundUrl);
}
//窗口的显示、隐藏
function popshow(){
 if(popTop>1500){
 closeDiv();
 return;
 }
 else if(popTop>1400&&popTop<1500){
  oPopup.show(screen.width-250,screen.height,200,1500-popTop);
 }else if(popTop>1300&&popTop<1400){
  oPopup.show(screen.width-250,screen.height+(popTop-1300),200,150);
 }else if(popTop<180){
  oPopup.show(screen.width-250,screen.height,200,popTop);
 }else if(popTop<200){
  oPopup.show(screen.width-250,screen.height-popTop,200,150);
 }
 popTop+=10;
 window.mytime=setTimeout("popshow();",50);
}

主要就是这些了，当然里面还有几个辅助性函数。