<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. 基于jquery的侧边栏分享导航

    今天给大家分享一款基于jquery的侧边栏分享导航.这款分享钮一直固定于左侧,鼠标经过的时候凸出显示,这款分享按钮适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲 ...

  2. JS模拟百度分享侧边栏效果

    模拟百度分享侧边栏的弹出与滑入效果.当鼠标移入#div1分享侧边栏,#div1分享侧边栏区块匀速滑出直至其全部露出.当鼠标移除#div1分享侧边栏,#div1分享侧边栏区块匀速滑入隐藏,直至恢复初始位 ...

  3. js动画实现侧边栏分享

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  4. JS组件系列——分享自己封装的Bootstrap树形组件：jqTree

    前言:之前的一篇介绍了下如何封装自己的组件,这篇再次来体验下自己封装组件的乐趣.看过博主博客的园友应该记得之前分享过一篇树形菜单的使用JS组件系列——Bootstrap 树控件使用经验分享,这篇里面第 ...

  5. [JS] HTML QQ分享界面js代码

    @ - @ :可以自己指定分享内容等....内含JS脚本 <html> <head> <title></title> <script type=& ...

  6. 微信js接口自定义分享内容

    最近客户有个要求,需要给网页添加微信分享功能,当然指的是用微信自带浏览器的时候,希望用户在最后一页点击分享的时候是分享的首页.曾经无意中看到过微信公众开发者平台提供了js接口,所以试着做了做,果然,跌 ...

  7. JS前端的分享功能

    给网页加上分享代码,借助网友的力量推广网站,目前已经很流行了 以下是网页代码 QQ空间分享代码如下: <a href="javascript:void(0);" onclic ...

  8. 工作中常用的JS函数整理分享（欢迎大家补充）

    今年在渣X工作整理的常用JS函数 今年来了渣X工作,我所在这个部门分工很奇怪,CSS竟然有专门的人在搞,开发PHP的人员需要处理JS,以至于有时候开发起来不是那么得心应手,感觉把JS和CSS拆开就像是 ...

  9. jweixin-1.1.0.js微信接口“分享给朋友”文字和图片配置

    在npm官网找到了:微信官方 js-sdk CommonJS 版https://www.npmjs.com/package/weixin-js-sdk 步骤一:引入JS文件在需要调用JS接口的页面引入 ...

随机推荐

  1. 爬虫之动态HTML处理（Selenium与PhantomJS ）执行 JavaScript 语句

    执行 JavaScript 语句 1.隐藏百度图片 from selenium import webdriverimport time driver = webdriver.PhantomJS()dr ...

  2. Numpy学习2

    载入数据和保存数据 In [34]: arr = np.loadtxt("/home/hadoop/wujiadong/np.txt") In [35]: np.save(&quo ...

  3. javascript的日常代码

    1. 直接输出文字:     document.write("<显示的类型>显示文字</类型>"); <script>document.writ ...

  4. Docker容器可以使用容器平台管理自动重启实现自修复吗？

    容器的自修复功能是经常被吹嘘的.因为容器是衣服,人躺下了,衣服也躺下了,容器平台能够马上发现人躺下了,于是可以迅速将人重新唤醒工作. 而虚拟机是房子,人躺下了,房子还站着.因而虚拟机管理平台不知道里面 ...

  5. [Pytorch]PyTorch使用tensorboardX（转

    文章来源: https://zhuanlan.zhihu.com/p/35675109 https://www.aiuai.cn/aifarm646.html 之前用pytorch是手动记录数据做图, ...

  6. 【网络结构】Deep Residual Learning for Image Recognition（ResNet） 论文解析

    目录 0. 论文链接 1. 概述 2. 残差学习 3. Identity Mapping by shortcuts 4. Network Architectures 5. 训练细节 6. 实验 @ 0 ...

  7. php调用mysql存储过程游标

    <?php $dbtype = 'mysql'; $host = 'localhost'; $dbname = 'test'; $dsn = "$dbtype:host=$host;d ...

  8. 使用 Vs 2015 快速上手 Angular2

    Visual Studio 2015 快速上手(使用Angular2)https://angular.cn/guide/visual-studio-2015 使用 Vs 2015 快速上手 Angul ...

  9. [mybatis]Record与Example的用法

    一.Record 一个Record是一个Dao对象(继承Mapper接口),tkmybatis会将record自动映射成sql语句,record中所有非null的属性都作为sql语句,如: 映射的sq ...

  10. phalcon: 项目地址/P(.*), 项目地址/Pbaidu 与 路由

    phalcon: 项目地址/P(.*) 与 路由 有一个项目地址:因客户渠道不同,带的参数也不相同.当时想到的是伪静态规则,但是发现自己没有那么强大.该走phalcon路由规则,地址如下: www.x ...