<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title></title>

		<style>

			body{position:relative;height:800px;}

			#wrap{width:300px;height:200px;background:#fafafa;box-shadow:5px 5px 5px #C9C9C9;position:absolute;top:50%;left:50%;margin-top:-100px;margin-left:-150px;}

			#close{position:absolute;right:0;font-size:20px;right:15px;top:5px;cursor:pointer;}

			.txt{max-height:100px;padding-top:30px;text-align:center;line-height:150px;}

			.tip{position:absolute;bottom:0;text-align:center;border-top:1px solid #ccc;padding:6px 0;width:100%;}

			#time{color:red;}

		</style>

	</head>

	<body>

		<div id="wrap">

			<div class="txt">弹窗文字内容</div>

			<div id="close">x</div>

			<div class="tip">倒计时<span id="time"></span>s自动关闭</div>

		</div>

		<script>

			window.onload=function(){

				var box=document.getElementById("wrap");

				var obj=document.getElementById("time");

				var close=document.getElementById("close");

				var num=10;

				obj.innerHTML=num;

				function timFn(){

					num--;

					obj.innerHTML=num;

					if(num == 0){

						box.style.display="none";

					}

				}

				setInterval(timFn,1000);

				close.onclick=function(){

					box.style.display="none";

				}

			}

		</script>

	</body>

</html>

　　

倒计时5S秒自动关闭弹窗的更多相关文章

  1. winfrom弹出窗口用timer控件控制倒计时20秒后关闭

    功能描述: 因为在程序退出时需要确认是否是误操作,所以加了密码输入的子窗体,子窗体在20秒内会自动关闭 代码如下: private int count; private void Form2_Load ...

  2. asp.net js 倒计时总秒数量 和 排序

    Edit in JSFiddle JavaScript HTML CSS Result h1 { font-family: "微软雅黑"; font-size: 40px; mar ...

  3. js 验证码 倒计时60秒

    js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...

  4. iOS-验证码倒计时60秒

    一. 要求 1.点击获取验证码按钮,60秒倒计时,按钮变成不可点击状态,按钮文字变成倒计时的秒数. 2.当倒计时为0的时候,释放掉定时器NSTimer,按钮变成可以点击状态,按钮文字变成"获 ...

  5. vue实现验证码倒计时60秒的具体代码

    vue实现验证码倒计时60秒的具体代码 <span v-show="show" @click="getCode">获取验证码</span> ...

  6. Android 实现简单 倒计时60秒，一次1秒

    倒计时功能如上图所示,其实就几行代码即可实现效果啦!!! /** 倒计时60秒,一次1秒 */ CountDownTimer timer = new CountDownTimer(60*1000, 1 ...

  7. js实现倒计时60秒的简单代码

    <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...

  8. js 简单实现获取短信按钮倒计时60秒

    <!DOCTYPE html><html lang="en"><head> <meta http-equiv="Content- ...

  9. js-弹框倒计时三秒后，自动关闭???

    效果: js: //弹出窗,三秒倒计时 countdown(){ //点击发布按钮后,三秒倒计时开始 $(".btn-pub").click(function(){ var cou ...

随机推荐

  1. numpy C语言源代码调试（三）

    鉴于ddd过于简陋,希望找一个新一些的调试工具,看到有很多人推荐gdbgui,这是一个非常新的调试工具,前端使用浏览器,现在采用这一架构的软件越来越多,可以完全不必依赖庞大的gui类库,安装使用比较方 ...

  2. 10 年三线小城 IT 开发的感悟

    一贯都是写技术博客,从来没写过感悟类文章,因为文笔不好.今天看到了大飞的一篇文章,<技术人,请不要封闭自己>,真的感触太深了. 一 先说说我自己,我并非科班出身,大学毕业后一直没找到好的工 ...

  3. 《k8s-1.13版本源码分析》-调度器框架

    本文原始地址(gitbook格式):https://farmer-hutao.github.io/k8s-source-code-analysis/core/scheduler/scheduler-f ...

  4. Python爬虫入门教程 37-100 云沃客项目外包网数据爬虫 scrapy

    爬前叨叨 2019年开始了,今年计划写一整年的博客呢~,第一篇博客写一下 一个外包网站的爬虫,万一你从这个外包网站弄点外快呢,呵呵哒 数据分析 官方网址为 https://www.clouderwor ...

  5. 【转载】通俗易懂，什么是.NET?什么是.NET Framework？什么是.NET Core?

    本文转载自:http://www.cnblogs.com/1996V/p/9037603.html [尊重作者原创,转载说明出处!感谢作者“小曾看世界”分享! ] 什么是.NET?什么是.NET Fr ...

  6. Java设置PDF有序、无序列表

    文档中的设置有序或无序列表是一种反应内容上下级关系或者内容相同属性的方式,与单纯的文字叙述相比,它能有效增强文档内容的条理性,突出重点.因此,本文将分享通过Java编程在PDF文档中设置有序或无序列表 ...

  7. maven私服上传jar包

    将一下脚本保存在.bat文件执行,红色部分按实际情况修改: @echo off set groupId=com.xxxset artifactId=xxxset version=0.0.1set ja ...

  8. ioremap_nocache() 函数的使用【转】

    本篇文章主要是在ioremap_nocache函数说明的基础上进行整理,加入该函数的用法简介. 函数原型 void __iomem * ioremap_nocache (unsigned long o ...

  9. 20190415 - iOS11 无法连接到 App Store 的解决办法

    问题:更新 iOS 11 后,打开 App Store 提示: 无法连接至 app store 解决: 进入 iOS 系统[设置][iTunes Store 与 App Store],退出当前登录用户 ...

  10. 开启全民窃听风云——C#智能录音录像录屏程序源码放送！

    ·引子 我这人从小有个坏毛病,就是喜欢偷窥别人隐私.当然,在道德上,我时刻要求自己做一名正人君子,只不过是心理上有这癖好罢了.所以我从小就对窃听.窃视.黑客技术.破解技术等疯狂着迷!实际上这也是我走上 ...