用JavaScript实现类MSN信息提示

 由于需要在系统中实现即时消息提示，参考了其它人写的代码，形成了下面的用JavaScript实现类MSN信息提示窗口。

   <script language="javascript" type="text/javascript">

    <!--

       /*
           **    作者：刘帝勇
           **    日期：2007-11-08
          */

        var oPopup;

        var iOriginTop = 50;

        var iPopTop = iOriginTop;

        var iWidth = 241;

        var iHeight = 172;

        var iTimer = 0;

        var iStep = 10;

        var iSpeed = 50;

        var bPause = false;       

        //初始化

        function IniPopup()

        {  

            //

            oPopup = window.createPopup();

            //

            var winstr="<table id=""tbMsg""BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid"" bgColor=""#cfdef4"" width=""" + iWidth +""" height=""" + iHeight + """ border=""0"" cellpadding=""2"" cellspacing=""2"">";

            winstr+="<tr ><td height=""30"" align=""left"" style='FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #003399; MARGIN-RIGHT: 4px' id=""tdCaption""></td><td align=""right""><SPAN title=关闭 style='FONT-WEIGHT: bold; FONT-SIZE: 12px; CURSOR: hand; COLOR: red; MARGIN-RIGHT: 4px' id='btClose'>×</SPAN></td></tr>";

            winstr+="<tr><td align=""center"" colspan=""2"">";

            winstr+="<table width=""90%"" height=""110"" border=""0"" cellpadding=""0"" cellspacing=""0"">";

            winstr+="<tr><td valign=""top""font-size:12px; color: #003399; face: Tahoma;PADDING-RIGHT: 1px;PADDING-BOTTOM: 1px;"" id=""tdContent""></td></tr>";

            winstr+="</table>";

            winstr+="</td></tr></table>";

            //

            oPopup.document.body.innerHTML = winstr; 

            oPopup.document.body.onmouseover = function(){bPause = true;}

            oPopup.document.body.onmouseout = function(){bPause = false;}  

            //

            oPopup.document.body.onclick = function()

            {

                var src = oPopup.document.parentWindow.event.srcElement;

                var sid = src.getAttribute("id");

                if(sid == "btClose" )

                {

                    HideMsg();

                }

                else

                {

                    //显示弹出窗口中的联机地址

                    var url = src.getAttribute("href");

                    if(url!=null)

                    {

                        window.open(url);

                        HideMsg();

                    }

                }

            }

        }

        //弹出消息框

        function PopMsg(captionstr,msgstr)

        {         

            oPopup.document.getElementById("tdCaption").innerHTML = captionstr;

            oPopup.document.getElementById("tdContent").innerHTML = msgstr;

            iTimer = window.setInterval("PopupShow()",iSpeed);

        }

        //渐次显示...

        function PopupShow()

        {

            if(bPause) return;

            if(iPopTop>1720)

            {

                HideMsg();

                return;

            }

            else if(iPopTop > 1520 && iPopTop<1720)

            {

                oPopup.show(screen.width - iWidth - 10,screen.height,iWidth,1720 - iPopTop);

            }

            else if(iPopTop > 1500 && iPopTop<1520)

            {

                oPopup.show(screen.width - iWidth - 10,screen.height + (iPopTop - 1720),iWidth,iHeight);

            }

           else if(iPopTop<(iHeight - 10))

            {

                oPopup.show(screen.width - iWidth - 10,screen.height,iWidth,iPopTop);

            }

            else if(iPopTop<(iWidth - 20))

            {

                oPopup.show(screen.width - iWidth - 10,screen.height - iPopTop,iWidth,iHeight);

            }

            iPopTop += iStep;

        }

        //隐藏消息

        function HideMsg()

        {

            if(oPopup!=null) 

            {

                window.clearInterval(iTimer);

                oPopup.hide();

                iPopTop = iOriginTop;

                bPause = false;

            }

        }

        //为调用使用

        function ShowMsg()

        {

            PopMsg("您有2条新的短消息","<li>新邮件<li><a href=http://news.sina.com.cn>新工作</a>");

        }

        IniPopup();

        //ShowMsg();

        window.setInterval("ShowMsg()",10000);

    //-->

    </script>