changecolor函数在javascript中不起作用

时间:2014-06-14 01:22:24

标签: javascript image function slider

我尝试了几种变化,但似乎无法使用此功能来操纵某些圆圈的颜色,这些圆圈是图像滑块的一部分。它需要在点击下一个箭头时工作。我添加了下一个功能我自己也很完美,但它有一个自己的按钮。 任何帮助将不胜感激。

这是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;
}

1 个答案:

答案 0 :(得分:0)

这是什么?

var col = document.getElementById("small")col.style.backgroundColor = "red";

不应该是这样的吗?

document.getElementById("small").style.backgroundColor = "red";