对联广告

最新推荐文章于 2024-07-23 03:41:07 发布

原创最新推荐文章于 2024-07-23 03:41:07 发布 · 152 阅读

CC 4.0 BY-SA版权

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>对联广告</title>
		<style>
			* {
				margin: 0;
				padding: 0;
				border: 0;
			}
			
			#box {
				width: 1000px;
				height: 2000px;
				background: #666;
				margin: 0 auto;
			}
			
			#left,
			#right {
				width: 100px;
				height: 200px;
				background: red;
				position: fixed;
				top: 200px;
			}
			
			#left {
				right: 50%;
				margin-right: 510px;
			}
			
			#right {
				left: 50%;
				margin-left: 510px;
			}
			
			.close {
				display: block;
				width: 100px;
				height: 40px;
				line-height: 40px;
				text-align: center;
				color: #fff;
				background: #CCCCCC;
			}
		</style>
		<script type="text/javascript">
			window.onload = function() {
				var oBox = document.getElementById('box');
				var aBtn = oBox.getElementsByTagName('a');
				for(var i = 0; i < aBtn.length; i++) {
					aBtn[i].onclick = function() {
						oBox.removeChild(this.parentNode);
					};
				}
			};
		</script>
	</head>

	<body>
		<div id="box">
			<div id="left">
				<a href="javascript:" class="close">关闭</a>
			</div>
			<div id="right">
				<a href="javascript:" class="close">关闭</a>
			</div>
		</div>
	</body>

</html>