Date:2018/11/18
重写广告弹出
源代码:
1、书写定时广告图片的定时操作 time = setInterval("showAd()",3000);
2、书写显示广告的函数 function showAd()
3、获取广告图片,并显示 $("#img2").show(4000);
4、清除显示图片的定时操作 clearInterval(time);
5、设置隐藏图片的定时操作 setInterval("hiddenAd()",3000);
6、书写隐藏广告的函数 function hiddenAd()
7、清除隐藏图片的定时操作 clearInterval(time);
注:clearInterval(time);是为了让图片只弹出一次,清除定时操作,
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首页</title>
<style>
#father{
border: 0px solid red;
width: 1300px;
height: 2170px;
margin: auto;
}
/*#logo{
border: 0px solid black;
width: 1300px;
height: 50px;
}*/
.top{
border: 0px solid blue;
width: 431px;
height: 50px;
float: left;
}
#top{
padding-top: 12px;
height: 38px;
}
#menu{
border: 0px solid red;
width: 1300px;
height: 50px;
background-color: black;
margin-bottom: 10px;
}
ul li{
display: inline;
color: white;
}
#clear{
clear: both;
}
#product{
border: 0px solid red;
width: 1300px;
height: 558px;
}
#product_top{
border: 0px solid blue;
width: 100%;
height: 45px;
padding-top: 8px;
}
#product_bottom{
border: 0px solid green;
width: 100%;
height: 500px;
}
#product_bottom_left{
border: 0px solid red;
width: 200px;
height: 500px;
float: left;
}
#product_bottom_right{
border: 0px solid blue;
width: 1094px;
height: 500px;
float: left;
}
#big{
border: 0px solid red;
width: 544px;
height: 248px;
float: left;
}
.small{
border: 0px solid blue;
width: 180px;
height: 248px;
float: left;
/*让里面的内容居中*/
text-align: center;
}
#bottom{
text-align: center;
}
a{
text-decoration: none;
}
</style>
<script type="text/javascript" src="../js/jquery-1.8.3.js" ></script>
<script>
$(function(){
time = setInterval("showAd()",3000);
});
function showAd(){
$("#img2").(4000);
clearInterval(time);
time = setInterval("hiddenAd()",1000