<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>个人简历</title>
</head>
<link rel="stylesheet" type="text/css" href="css/style.css">
<body>
<!--顶部导航-->
<div>
<div>
<span>个人简历</span>
<div>
<ul>
<li><a href=""></a>我的技能</li><li><a href=""></a>工作经验</li><li><a href=""></a>兴趣爱好</li><li><a href=""></a>作品展示</li>
</ul>
</div>
</div>
</div>
<!--自动轮播-->
<div>
<div id="banner">
<a href="">
<div class="banner-slide slide1 active"></div>
</a>
<a href="">
<div class="banner-slide slide2"></div>
</a>
<a href="">
<div class="banner-slide slide3"></div>
</a>
</div>
</div>
<!--个人简介-->
<div></div>
<!--自我评价-->
<div></div>
<!--底部-->
<div></div>
<script type="text/javascript" src="js/myjs.js"></script>
</body>
</html>
JS代码如下：
var timer=null,
index=0,
pics=byId("banner").getElementsByTagName("div"),
size=pics.length;
function byId(id){
return typeof(id)==="string"?document.getElementById("id"):id;
}
//停止自动播放
function stopAutoPlay(){
if(timer){
clearInterval(timer);
}
}
//图片自动轮播
function stratAutoPlay(){
timer=setInterval(function(){
index++;
if(index>=size){
index=0;
}
changeImg();
},3000)
}
function changeImg(){
for(var i=0;i<pics.length;i++){
pics[i].style.display='none';
}
pics[index].style.display='block';
}
function slideImg(){
var banner=byId("banner");
banner.onmouseover=function(){
stopAutoPlay();
}
banner.onmouseout=function(){
stratAutoPlay();
}
banner.onmouseout();
}
slideImg();
浏览器控制台报错Cannot read property 'getElementsByTagName' of null，鸣鸣有存在DIV的元素啊
ExiaGo