网页右下方弹出提示框

最新推荐文章于 2021-06-04 00:56:57 发布

mengxianhua

最新推荐文章于 2021-06-04 00:56:57 发布

阅读量914

点赞数

分类专栏： JavaScript HTML/CSS 文章标签： border function class xhtml javascript div

JavaScript 同时被 2 个专栏收录

37 篇文章 0 订阅

订阅专栏

HTML/CSS

9 篇文章 0 订阅

订阅专栏

<!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" οnclick="tips_pop()">X</span>
        </div>
        <div class="content">未读消息(3)</div>
    </div>
</body>
</html>

mengxianhua

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
网页右下方弹出提示框

#winpop { width:200px; height:0px; position:absolute; right:0; bottom:0px; border:1px solid #99999; margin:0px; padding:1px; overflow:hidden; backgrou
复制链接

扫一扫

专栏目录