• 打开网页2秒后出现弹框（之前发的定时器练习）
• 效果图：

css

	<style type="text/css">
	 /*隐藏弹窗*/
		#a{
			display: none;
		}
		/*弹窗样式*/
		.b{
			width: 400px;
			height: 300px;
			background-color: #fff;
			border: 1px solid #000;
			position: fixed;
			left: 50%;
			top: 50%;
			margin-left: -200px;
			margin-top: -150px;
			/*层次级别*/
			z-index: 9999;
		}
		/*弹窗背景灰度*/
		.c{
			position: fixed;
			width: 100%;
			height: 100%;
			background-color: #000;
			left: 0;
			top:0;
			/*透明度*/
			opacity: 0.3;
			/*兼容ie*/
			filter: alpha(opacity=30);
			z-index: 9990;
		}
		#off{
			text-decoration: none;
			position: absolute;
			right: 10px;
			top: 10px;
		}
	</style>

javascript

<script type="text/javascript">
		window.onload=function(){
			var a = document.getElementById('a');
			var off = document.getElementById('off');
			//网页打开两秒后出项弹窗
			setTimeout(function(){
				a.style.display = 'block';
			},2000);
			//点击关闭弹窗
			off.onclick=function(){
				a.style.display = 'none';
			}
		}
	</script>

html

<h1>首页标题</h1>
<p>首页内容</p>
<div id="a">
	<div class="b">
		<h3>这是一个弹框！</h3>
		<a href="#" id="off">关闭</a>
	</div>
 
	<div class="c"></div>
</div>