作业
css部分：
*{
margin: 0;
padding: 0;
}
li{
list-style-type: none;
}
body{
font-family: "微软雅黑";
color: #14191e;
}
a:link,a:visited{
text-decoration: none;
color: #333;
}
/*整体页面*/
.main{
width: 1200px;
height: 520px;
margin: 20px auto;
}
/*导航*/
.menu{
width: 1200px;
height: 60px;
}
ul{
width: 1200px;
height: 60px;
}
.inner{
width: 300px;
height: 60px;
font-size: 20px;
line-height: 60px;
text-align: center;
float: left;
}
.active{
background-color:#ffcc00;
}
/*banner图*/
.banner{
width: 1200px;
height: 460px;
position: relative;
}
.bannre-slide{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
display: none;
}
.banner-active{
display: block;
}
js部分：
//封装代替getElementById()的方法
function byId(id){
if(typeof(id)==="string"){
return document.getElementById(id);
}
else{
return id;
}
}
//全局变量
var index=0,
timer=null,
pits=byId("banner").getElementsByTagName("img"),
dots=byId("menu").getElementsByTagName("li"),
len=pits.length;
function slideImg(){
var main=byId("main");
//鼠标悬停整个main区域时，清除定时器
main.onmouseover=function(){
if(timer){
clearInterval(timer);
}
}
//鼠标离开启动定时器
main.onmouseout=function(){
timer=setInterval(function(){
index++;
if(index>=len){
index=0;
}
changeImg();
},2000)
}
main.onmouseout();
//绑定点击事件
for(var d=0;d |
天盟APP下载
