zoukankan      html  css  js  c++  java
  • QQ右下角浮动窗口

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    </head>
    <body>
    <h1>我的qq浮动</h1>
    <style>
    #qq_box{223px;height:133px;background:#ccc;position:fixed;right:0px;bottom:10px;
    background:url(http://nanke.jdjlnk.com/images/qq_xf.gif);}
    #qq_close{40px; height:20px;position:absolute;right:0;top:0;cursor:pointer;}
    #qq_box_l{40px; height:30px;position:absolute;right:50px;bottom:0;cursor:pointer;}
    #qq_box_r{40px;height:30px;position:absolute;right:0;bottom:0;cursor:pointer;}
    </style>
    <div id="qq_box" style="display: block;">
    <a id="qq_close"></a><a href="http://put.zoosnet.net/LR/Chatpre.aspx?id=PUT16019242&lng=cn" target="_blank" id="qq_box_l"></a><a id="qq_box_r"></a>
    </div>
    <script>
    function domReady(fn){
    if(document.addEventListener){
    document.addEventListener('DOMContentLoaded',function(){fn && fn();},false);
    }else{
    var oS=document.createElement('script');oS.defer='1';oS.src='';
    var oHead=document.getElementsByTagName('head')[0];oHead.appendChild(oS);
    oS.onreadystatechange=function(){if(oS.readyState=='complete'){fn && fn();}}
    }
    };
    domReady(function(){
    (function(){
    var qq_box = document.getElementById("qq_box");
    var qq_close = document.getElementById("qq_close");
    var qq_box_l = document.getElementById("qq_box_l");
    var qq_box_r = document.getElementById("qq_box_r");
    var qq_timer=null;
    qq_timer=setInterval(function(){qq_box.style.display='block';},2000);
    qq_close.onclick=close_fn;
    qq_box_r.onclick=close_fn;
    function close_fn(){clearInterval(qq_timer);qq_box.style.display='none';
    qq_timer=setInterval(function(){qq_box.style.display='block';},10000);
    }
    })();
    });
    </script>
    </body>
    </html>

    ----------------------------

    gif图片:

  • 相关阅读:
    Eclipse Alt + / 无提示
    洛谷 P1101 单词方阵
    力扣题解 7th 整数反转
    力扣题解 344th 反转字符串
    力扣题解 48th 旋转图像
    力扣题解 36th 有效的数独
    力扣题解 1th 两数之和
    力扣题解 283th 移动零
    力扣题解 66th 加一
    力扣题解 350th 两个数组的交集 II
  • 原文地址:https://www.cnblogs.com/cbboys/p/4521552.html
Copyright © 2011-2022 走看看