网页右下方弹出提示框

2019PHP高薪工程师学习路线图....>>>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
      
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
        <title></title>  
        <style type="text/css">  
            #winpop   
            {  
                width:200px; height:0px; position:absolute;   
                right:0; bottom:0px; border:1px solid #99999;  
                margin:0px; padding:1px; overflow:hidden; background:#fff; display:none;  
             }  
             div.title  
             {   
                 width:100%; height:20px; line-height:20px; background:#290052;  
                 font-weight:bold; text-align:center; font-size:12px; color:#fff;   
             }  
             div.content  
             {  
                 width:100%; height:80px; line-height:80px; font-weight:bold; font-size:12px; color:#ff0000;  
                 text-decoration:underline; text-align:center; border:1px solid #290052;  
             }  
             .close  
             {  
                 position:absolute; right:4px; top:-1px; color:#fff; cursor:pointer;  
             }  
             #glide{background:yellow; border:1px solid blue; display:none;}  
        </style>  
        <script language="javascript" type="text/javascript">  
            var MsgPop;  
            var popH;  
            var oDiv;  
            var oDivW;  
            var oDivH;  
            window.onload = function () {  
                MsgPop = document.getElementById("winpop");  
                MsgPop.style.height = "0px";  
      
                tips_pop();  
                setTimeout("tips_pop()", 5000);  
            }  
            function tips_pop() {  
                popH = parseInt(MsgPop.style.height);  
                if (popH == 0) {  
                    MsgPop.style.display = "block";  
                    show =setInterval("changeH('up')", 2);  
                }  
                else {  
                    hide = setInterval("changeH('down')", 2);  
                }  
            }  
            function changeH(str) {  
                popH = parseInt(MsgPop.style.height);  
                if (str=="up") {  
                    if (popH <= 100) {  
                        MsgPop.style.height = (popH + 4).toString() + "px";  
                    }  
                    else {  
                        clearInterval(show);  
                    }  
                }  
                if (str == "down") {  
                    if (popH >= 4) {  
                        MsgPop.style.height = (popH -4).toString() + "px";  
                    }  
                    else {  
                        clearInterval(hide);  
                        MsgPop.style.display = "none";  
                    }  
                }  
            }  
        </script>  
    </head>  
    <body>  
        <div id="winpop">  
            <div class="title">  
                短消息<span class="close" onclick="tips_pop()">X</span>  
            </div>  
            <div class="content">未读消息(5)</div>  
        </div>  
    </body>  
    </html>