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>

  • 相关阅读:
    win7下的vxworks总结
    ubuntu 无法获得锁 /var/lib/dpkg/lock
    项目中用到了的一些批处理文件
    win7下安装 WINDRIVER.TORNADO.V2.2.FOR.ARM
    使用opencv统计视频库的总时长
    January 05th, 2018 Week 01st Friday
    January 04th, 2018 Week 01st Thursday
    January 03rd, 2018 Week 01st Wednesday
    January 02nd, 2018 Week 01st Tuesday
    January 01st, 2018 Week 01st Monday
  • 原文地址:https://www.cnblogs.com/xrtd/p/3768958.html
Copyright © 2011-2022 走看看