我尝试了几种变化,但似乎无法使用此功能来操纵某些圆圈的颜色,这些圆圈是图像滑块的一部分。它需要在点击下一个箭头时工作。我添加了下一个功能我自己也很完美,但它有一个自己的按钮。 任何帮助将不胜感激。
这是javascript ...
<!DOCTYPE HTML>
<html>
<head>
<title>Sidelines In The Ulvestad</title>
<link rel="stylesheet" type="text/css" href="flow.css" >
<script type="text/javascript">
var currentPhoto = 0; var pics = new Array();
window.onload=function() {
for (var i =0; i< 10; i++) {
pics[i] = new Image();
}
pics[0].src = "ulvestadside.png";
pics[1].src = "usl2.png";
pics[2].src = "usl3.png";
pics[3].src = "usl4.png";
pics[4].src = "usl5.png";
pics[5].src = "usl6.png";
pics[6].src = "usl7.png";
pics[7].src = "usl8.png";
pics[8].src = "usl9.png";
document.getElementById("next").onclick=nextPic;
document.getElementById("prev").onclick=prevPic;
document.getElementById("reset").onclick=reSet;
}
function changePhoto(photo) {
document.images[0].src = pics[photo].src;
}
function nextPic(){
currentPhoto++;
changecolor();
if(currentPhoto < pics.length) {
changePhoto(currentPhoto);
}else{
reSet();
}
}
function prevPic() {
if (currentPhoto >0) {
currentPhoto--;
changePhoto(currentPhoto);
}
}
function reSet() {
document.images[0].src = pics[0].src;
currentPhoto = 0;
}
function changecolor() {
var col = document.getElementById("small")col.style.backgroundColor = "red";
}
</script>
这是相关的HTML ......
<div class="wrapper4">
<div class ="post2f">
<img src="ulvestadside.png">
<div id ="next"> <img src ="arrow3.png"> </div>
<div id ="prev"><img src = "arrow4.png"> </div>
<button id = "reset"> reset</button>
<div id ="small"> </div>
<div id ="small1"> </div>
<div id ="small2"> </div>
<div id ="small3"> </div>
<div id ="small4"> </div>
<div id ="small5"> </div>
<div id ="small6"> </div>
<div id ="small7"> </div>
</div>
</div>
</body>
</html>
这是css ....
#small {
position:absolute;
top:390px;
left:50px;
background-color:black;
height: 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
width: 10px;
}
答案 0 :(得分:0)
这是什么?
var col = document.getElementById("small")col.style.backgroundColor = "red";
不应该是这样的吗?
document.getElementById("small").style.backgroundColor = "red";