Делал слайдер изображений на яваскрипте, по клику меняется изображение. Проверял работоспособность в firefox все работает. Попробовал в яндекс браузере не работает, пробовал в ie и gogle chrome тоже не работает. Вот код. Подскажите пожалуйста в чем беда?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Panel</title>
<style type="text/css">
body{
background-color: #111;
}
footer{
height: 100px;
margin: auto;
width: 1000px;
}
#mainDiv{
border: 1px solid #aaa;
border-radius: 6px;
background-color: #000;
height: 600px;
margin: auto;
padding-top: 100px;
width: 1000px;
}
#backSlide{
height: 500px;
margin: auto;
width: 800px;
}
#left{
display: block;
margin-left: 10px;
margin-top: 20px;
float: left;
}
#right{
display: block;
float: right;
margin-right: 10px;
margin-top: 20px;
}
#ind{
border: 1px solid #fff;
background-color: #111;
border-radius: 5px;
color: #fff;
font-weight: bold;
margin: auto;
margin-top: 20px;
font-size: 50px;
text-align: center;
height: 60px;
width: 60px;
}
</style>
<script type="text/javascript">
var images = new Array();
images[1] = "1.jpg";
images[2] = "2.jpg";
images[3] = "3.jpg";
var img = document.getElementById("img");
var n = 1;
function goRight(){
if(n !=3){
n+=1;
}else{
n = 1;
}
var ind = document.getElementById("ind");
document.img.setAttribute("src",images[n]);
ind.innerHTML = n;
}
function goLeft(){
if(n !=1){
n-=1;
}else{
n = 3;
}
var ind = document.getElementById("ind");
document.img.setAttribute("src",images[n]);
ind.innerHTML = n;
}
</script>
</head>
<body>
<footer>
</footer>
<div id="mainDiv">
<div id="backSlide">
<img src="1.jpg" id="img" alt="image"/>
<div id="ind">1</div>
</div>
<a href="javascript:goLeft()" id="left"><img src="left.png"/></a>
<a href="javascript:goRight()" id="right"><img src="right.png"/></a>
</div>
</body>
</html>
Простой
