<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>商品主頁</title>
<style>
#bigdiv {
border: 1px solid blue;
width: 90% px;
}
.logodiv {
border: 1px solid blue;
width: 33%;
float: left;
height: 57px;
}
.shangpindiv1 {
border: 1px solid blue;
width: 25%;
float: left;
}
.shangpindiv2 {
border: 1px solid blue;
width: 73%;
float: left;
height: 235px;
}
.shangpindiv3 {
border: 1px solid blue;
width: 24%;
float: left;
height: 235px;
}
.clear {
clear: both;
}
</style>
<script>
var time;
window.onload = function() {
window.setInterval("change()", 1000);
//time = window.setInterval("show()", 2000);
window.setTimeout("show()", 2000);
}
var i = 2;
function change() {
var image2 = document.getElementById("image2");
if (i == 7) {
i = 2;
} else {
i = i + 5;
}
image2.src = "image/" + i + ".png";
}
function show() {
var ad = document.getElementById("ad");
ad.style.display = "block";
//window.clearInterval(time);
//time = window.setInterval("hidden()", 2000);
window.setTimeout("hidden()", 2000);
}
function hidden() {
var ad = document.getElementById("ad");
ad.style.display = "none";
//window.clearInterval(time);
}
</script>
</head>
<body>
<div id=bigdiv>
<div style="width: 100%">
<img src="image/ad.png " id="ad" width="20%">
</div>
<div>
<div class="logodiv">
<img src="image/0.png" height="57" />
</div>
<div class="logodiv">
<img src="image/1.png" width="100%" />
</div>
<div
style="width: 33%; height: 42px; float: left; padding-top: 15px;">
<a href="#">登陸</a> <a href="註冊.html">註冊</a> <a href="#">購物車</a>
</div>
<div class="clear"></div>
</div>
<div>
<div class="shangpindiv1">
<img src="image/2.png" width="100%" id=image2>
</div>
<div style="border: 1px solid blue; width: 74%; float: left;">
<div>
<div class="shangpindiv2">
<img src="image/3.png" width="100%" height="100%">
</div>
<div class="shangpindiv3">
<img src="image/4.png" width="100%">
</div>
<div class="shangpindiv3">
<img src="image/4.png" width="100%">
</div>
</div>
<div>
<div class="shangpindiv3">
<img src="image/4.png" width="100%">
</div>
<div class="shangpindiv3">
<img src="image/4.png" width="100%">
</div>
<div class="shangpindiv3">
<img src="image/4.png" width="100%">
</div>
<div class="clear"></div>
</div>
</div>
</div>
<div style="width: 100%; border: 1px solid blue;">
<img src="image/5.png" width="100%">
</div>
<div style="width: 100%; border: 1px solid blue;">
<center>
<a href="">關於我們 </a> <a href="">聯繫我們 </a> <a href="">招賢納士</a><a
href=""> 友情鏈接</a>
</center>
</div>
</div>
</body>
</html>JS實現主頁廣告隱藏顯示
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.