zoukankan      html  css  js  c++  java
  • 网页右下角弹出窗体

    <!--开始-->
    <style type="text/css">
    #msg_win{position:absolute;right:0px;display:none;overflow:hidden;z-index:99;border:1px solid #c00;background:#F9EFFC;210px;font-size:12px;margin:0px;}
    #msg_win .icos{position:absolute;top:2px;*top:0px;right:2px;z-index:9;}
    .icos a{float:left;color:#FFFFFF;margin:1px;text-align:center;font-weight:bold;14px;height:22px;line-height:22px;padding:1px;text-decoration:none;font-family:webdings;}
    .icos a:hover{color:#FFCC00;}
    #msg_title{background:#FA6705;border-bottom:1px solid #710B97;border-top:1px solid #FFF;border-left:1px solid #FFF;color:#FFFFFF;height:25px;line-height:25px;text-indent:5px;font-weight:bold;}
    #msg_content{margin:1px;margin-right:0;210px;height:160px;overflow:hidden; text-align:center}
    </style>
    <!--结束-->

    <div id="msg_win" style="display:block;top:503px;visibility:visible;opacity:1;">
    <div class="icos"><a id="msg_min" title="最小化" href="javascript:void 0">_</a><a id="msg_close" title="关闭" href="javascript:void 0">×</a></div>
    <div id="msg_title">标题
    </div>
    <div id="msg_content">
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
    codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="210" height="160">
    <param name="movie" value="flvplayer.swf?vcastr_file=userlogin/video/qlg.flv&IsAutoPlay=1"/>
    <param name="quality" value="high"/>
    <param name="allowFullScreen" value="true" />
    <embed src="flvplayer.swf?vcastr_file=userlogin/video/qlg.flv&IsAutoPlay=1" allowFullScreen="true" quality="high"
    pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="210" height="160"></embed>
    </object>
    </div>
    </div>
    <script type="text/javascript">
    var Message = {
    set: function () {//最小化与恢复状态切换
    var set = this.minbtn.status == 1 ? [0, 1, 'block', this.char[0], '最小化'] : [1, 0, 'none', this.char[1], '恢复'];
    this.minbtn.status = set[0];
    this.win.style.borderBottomWidth = set[1];
    this.content.style.display = set[2];
    this.minbtn.innerHTML = set[3]
    this.minbtn.title = set[4];
    this.win.style.top = this.getY().top;
    },
    close: function () {//关闭
    this.win.style.display = 'none';
    document.all.xhs1.stop();
    window.onscroll = null;
    },
    setOpacity: function (x) {//设置透明度
    var v = x >= 100 ? '' : 'Alpha(opacity=' + x + ')';
    this.win.style.visibility = x <= 0 ? 'hidden' : 'visible'; //IE有绝对或相对定位内容不随父透明度变化的bug
    this.win.style.filter = v;
    this.win.style.opacity = x / 100;
    },
    show: function () {//渐显
    clearInterval(this.timer2);
    var me = this, fx = this.fx(0, 100, 0.1), t = 0;
    this.timer2 = setInterval(function () {
    t = fx();
    me.setOpacity(t[0]);
    if (t[1] == 0) { clearInterval(me.timer2) }
    }, 6); //10 to 6
    },
    fx: function (a, b, c) {//缓冲计算
    var cMath = Math[(a - b) > 0 ? "floor" : "ceil"], c = c || 0.1;
    return function () { return [a += cMath((b - a) * c), a - b] }
    },
    getY: function () {//计算移动坐标
    var d = document, b = document.body, e = document.documentElement;
    var s = Math.max(b.scrollTop, e.scrollTop);
    var h = /BackCompat/i.test(document.compatMode) ? b.clientHeight : e.clientHeight;
    var h2 = this.win.offsetHeight;
    return { foot: s + h + h2 + 2 + 'px', top: s + h - h2 - 2 + 'px' }
    },
    moveTo: function (y) {//移动动画
    clearInterval(this.timer);
    var me = this, a = parseInt(this.win.style.top) || 0;
    var fx = this.fx(a, parseInt(y));
    var t = 0;
    this.timer = setInterval(function () {
    t = fx();
    me.win.style.top = t[0] + 'px';
    if (t[1] == 0) {
    clearInterval(me.timer);
    me.bind();
    }
    }, 6); //10 to 6
    },
    bind: function () {//绑定窗口滚动条与大小变化事件
    var me = this, st, rt;
    window.onscroll = function () {
    clearTimeout(st);
    clearTimeout(me.timer2);
    me.setOpacity(0);
    st = setTimeout(function () {
    me.win.style.top = me.getY().top;
    me.show();
    }, 100); //600 mod 100
    };
    window.onresize = function () {
    clearTimeout(rt);
    rt = setTimeout(function () { me.win.style.top = me.getY().top }, 100);
    }
    },
    init: function () {//创建HTML
    function $(id) { return document.getElementById(id) };
    this.win = $('msg_win');
    var set = { minbtn: 'msg_min', closebtn: 'msg_close', title: 'msg_title', content: 'msg_content' };
    for (var Id in set) { this[Id] = $(set[Id]) };
    var me = this;
    this.minbtn.onclick = function () { me.set(); this.blur() };
    this.closebtn.onclick = function () { me.close() };
    this.char = navigator.userAgent.toLowerCase().indexOf('firefox') + 1 ? ['_', '::', '×'] : ['0', '2', 'r']; //FF不支持webdings字体
    this.minbtn.innerHTML = this.char[0];
    this.closebtn.innerHTML = this.char[2];
    setTimeout(function () {//初始化最先位置
    me.win.style.display = 'block';
    me.win.style.top = me.getY().foot;
    me.moveTo(me.getY().top);
    }, 0);
    return this;
    }
    };
    Message.init();
    </script>

  • 相关阅读:
    204. Count Primes (Integer)
    203. Remove Linked List Elements (List)
    202. Happy Number (INT)
    201. Bitwise AND of Numbers Range (Bit)
    200. Number of Islands (Graph)
    199. Binary Tree Right Side View (Tree, Stack)
    198. House Robber(Array; DP)
    191. Number of 1 Bits (Int; Bit)
    190. Reverse Bits (Int; Bit)
    189. Rotate Array(Array)
  • 原文地址:https://www.cnblogs.com/xrtd/p/3768958.html
Copyright © 2011-2022 走看看