可关闭广告层

时间：2007-06-30 来源：linxh

本文转自: http://www.jzmap.com/webd/8-3/2006-12-25/47.html

一个简单的广告层，演示

源码如下：

<html>
<head>
<title>Ad box demonstration</title>
<style>
body {
  width: 800px;
}
.ad-box {
  background: #eee;
  border: 1px solid black;
  padding: 5px;
  position: absolute;
  left: 50px;
  top: 50px;
  width: 600px;
}
.ad-box-title {
  background: #ccc;
  padding: 5px;
  font-weight: bold;
  font-size: large;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}
</style>
<script>
function closead()
{
  var obj = document.getElementById( "ad" );
  obj.style.visibility = "hidden";
}
</script>
</head>
<body>
<div class="ad-box" id="ad">
<div class="ad-box-title">
欢迎！
</div>
<p>
欢迎光临建站地图网，在这里你可以找到许多的网站建设方面的资讯。
我们的网址是www.jzmap.com
</p>
<p style="text-align: right;">
<a href="javascript:closead();">关闭</a>
</p>
</div>
<p>这是我的个人主页，欢迎您的到来!</p>
<h1>相关信息</h1>
<p>关于我们:</p>
<ul>
<li>内容1</li>
<li>内容2</li>
</ul>
</body>
</html>