<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>广告自动关闭</title>

    </head>

    <style>

        .tip{

            position: fixed;

            top: 100px;

            left: 400px;

            display: block;

            width: 400px;

            height: 200px;

            border-style: dotted;

            border-width: thin;

            border-color: darkgreen;

            background: #f0c;

            z-index: 100;

        }

    </style>

    <script type="text/javascript" src="js/base.js"></script>

    <script>

        /*

        window.onload = function(){

            var timer = setInterval(function(){

                var _span = document.getElementsByTagName("span")[0];

                _span.innerHTML -= 1;

                if(_span.innerHTML == 0){

                    clearInterval(timer);

                    document.getElementById("ad").style.display = "none";

                }

            },1000);

        }

        */

        window.onload = function(){

            var num = 5;

            var oDiv = document.getElementById("ad");

            var t = setInterval(function(){

                countDown();

                if(num == 0) {

                    clearInterval(t);

                    oDiv.style.display = "none";

                }

            },1000);

            function countDown(){

                oDiv.children[0].innerHTML -= 1;

                num--;

            }

        }

    </script>

    <body>

        <div id="ad" class="tip">

            我是一条广告，谢谢！

            <span style="color:yellow; font-weight:bold;">5</span>秒钟后自动关闭

        </div>

    </body>

</html>

　　

 

js之广告弹出自动关闭的更多相关文章

  1. 原生Js封装的弹出框-弹出窗口-页面居中-多状态可选

    原生Js封装的弹出框-弹出窗口-页面居中-多状态可选   实现了一下功能: 1.title可自定义 可拖拽 2.width height可以自定义 3.背景遮罩和透明度可以自定义 4.可以自己编辑弹出 ...

  2. JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法

    本文实例讲述了js+CSS实现弹出一个全屏灰黑色透明遮罩效果的方法.分享给大家供大家参考.具体分析如下: 在众多的网站都有这样的效果,当进行一定的操作之后,会弹出一个灰黑色的半透明的遮罩,在上面可以操 ...

  3. js进阶 11-20 弹出层如何制作

    js进阶 11-20 弹出层如何制作 一.总结 一句话总结:其实就是一个div,控制显示和隐藏即可.设置成绝对定位更好,就可以控制弹出层出现的位置.关闭的画质需要将display重新设置为none就好 ...

  4. JS网页顶部弹出可关闭广告图层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. js点击弹出div层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. JS 点击弹出图片/ 仿QQ商城点击左右滚动幻灯片/ 相册模块，点击弹出图片，并左右滚动幻灯片

    1, 点击弹出图片 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  7. JS来添加弹出层，并且完成锁屏

    上图 <html> <head> <title>弹出层</title> <style type="text/css"> ...

  8. 前段js的各种弹出框

    artDialog 首页 > 文档与示例 artDialog —— 经典的网页对话框组件,内外皆用心雕琢. 支持普通与 12 方向气泡状对话框 完善的焦点处理,自动焦点附加与回退 支持 ARIA ...

  9. datatables.js 简单使用--弹出编辑框或添加数据框

    内容:选中某一条记录,弹出编辑框 环境:asp.net mvc ,  bootstrap 显示效果: 代码: 至于怎么弄多选框,在上一篇博客里已经有说明. 主要用到了bootstrap的模态窗,下面代 ...

随机推荐

  1. LeetCode——Find Largest Value in Each Tree Row

    Question You need to find the largest value in each row of a binary tree. Example: Input: 1 / \ 3 2 ...

  2. eclipse中把多个项目放在一个文件夹里

    1..Package Explorer 可以在这里打开 2.选择Working sets 3.新建java working set 4.把文件夹显示出来 5.可以把项目移动到文件夹里面了,鼠标左键拖就 ...

  3. JavaScript的动态特性(通过eval,call,apply和bind来体现)

    JavaScript的动态特性(通过eval,call,apply和bind来体现) JavaScript是一种基于面向对象的.函数式的.动态的编程语言.现在发展到已经可以用在浏览器和服务器端了. 这 ...

  4. .net 获取浏览器Cookie（包括HttpOnly）

    网上好不容易找到的,分享+收藏 一.接口文件 using System; using System.ComponentModel; using System.Net; using System.Run ...

  5. 一些putty的应用设置

    把windows下putty的key转换成linux上使用的rsa key    http://ask.apelearn.com/question/937 putty生成的密钥导入connectbot ...

  6. Win10配Theano环境和Keras框架

    网络上有各种各样的win7 64bit安装theano的方法,我也试过好多,各种各样的问题.因为之前没了解过MinGw等东西,所以安装起来比较费劲,经过不断的尝试,最终我按照以下过程安装成功. 其实过 ...

  7. 数组中的k个最小值

    问题:输入n个整数,找出其中最小的k个数. 方案一:将输入的n个整数进行排序,输出前k个数即为所求的k个最小数.时间复杂度为O(nlogn). 方案二:创建一个大小为k的容器,来存储最小的k个数.遍历 ...

  8. mysql数据库优化课程---18、mysql服务器优化

    mysql数据库优化课程---18.mysql服务器优化 一.总结 一句话总结: 1.四种字符集问题:字符集都设置为utf-82.slow log慢查询日志问题3.root密码丢失 1.mysql存在 ...

  9. Dubbo本地开发技巧

    背景 作为后端服务负载.前后分离的主要手段,dubbo在业界中使用率还比较高.随着Dubbo系统的增多,本地开发.调试就出现了麻烦之处 直接在开发本地起同样一份服务 由于Dubbo采用负载均衡的策略, ...

  10. 获取CPU和内存的使用率

    1.获取CPU的使用率 主要就是一个计算. int CUseRate::GetCPUUseRate() //获取CPU使用率 { ; FILETIME ftIdle, ftKernel, ftUser ...