js 用轮播的图片改变导航栏的颜色,新手求代码
2个回答
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
span{
width: 40px;height: 5px;background: aqua;display: block;float: left;margin-left: 15px;margin-top: 300px;
}
</style>
</head>
<body>
<div>
<!--由于没有图片资源,所以就用alt 中的文字改变代替图片了 -->
<img src="1.jpg" alt="第一张图片" width="480" height="280" class="image" >
<span></span>
<span></span>
<span></span>
</div>
<script>
function $(id){
var temp = id.substr(1,id.length);
switch (id.charAt(0)) {
case "#":
return document.getElementById(temp);
case ".":
return document.getElementsByClassName(temp);
default:
return document.getElementsByTagName(id);
}
}
var array = ["第一张图片","第二张图片","第三张图片"];
var len = array.length;
var i = 0;
var img = $(".image")[0];
var span = $("span");
setInterval(function(){
if(i<len-1){
i++;
}else{
i = 0;
}
img.src=array[i];
img.alt=array[i];
for(var j=0;j<span.length;j++){
span[j].style.background = "aqua";
}
span[i].style.background = "red";
},1000)
</script>
</body>
</html>
追问
怎么让指定一张图片,然后导航条字体变色。就比如之前字体是白色,轮播到这张图片他变黑色。感谢大佬的帮助,跪谢~!
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询