我是一种新的 Javascript。我正在尝试创建一个带有下一个和上一个按钮的简单图库，单击该按钮会将这些图像循环到前面。我设法找到了一些教程和位来让图像点击通过，但是我仍然坚持我做错了什么。下一个/上一个按钮位于左上角，并且希望以缩略图为中心，如左上角的上一个，缩略图右上角的下一个。我去过本地的图书馆，但仍然无法弄清楚。
我做错了什么以及如何纠正它？谢谢。
<html>
<head>
<link rel="stylesheet" type="text/css" href="test2.css">
<title>Simple Playing Around</title>
</head>
<script type="text/javascript">
var photos=new Array()
var which=0
photos[0]='http://i67.tinypic.com/20uv0vp.png'
photos[1]='http://i67.tinypic.com/20uv0vp.png'
photos[2]='http://i67.tinypic.com/20uv0vp.png'
photos[3]='http://i67.tinypic.com/20uv0vp.png'
function backward(){
if (which > 0){
which=which-1
document.images.photoslider.src=photos[which]
}
}
function backward(){
if (which>0){
which=which-1;
} else {
which=photos.length-1;
}
document.images.photoslider.src=photos[which];
}
function forward(){
if (which<photos.length-1){
which=which+1;
} else {
which=0;
}
document.images.photoslider.src=photos[which];
}
}
</script>
<form>
<input type="button" value="<<Back" onClick="backward()">
<input type="button" value="Next>>" onClick="forward()">
</form>
<body>
<div class="gallery" align="center">
<h3>Thumbnails</h3>
<div class="thumbnails">
<img onmouseover="preview.src=img1.src" name="img1" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
<img onmouseover="preview.src=img2.src" name="img2" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
<img onmouseover="preview.src=img3.src" name="img3" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
<img onmouseover="preview.src=img4.src" name="img4" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
<img onmouseover="preview.src=img5.src" name="img5" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
<img onmouseover="preview.src=img6.src" name="img6" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
<img onmouseover="preview.src=img7.src" name="img7" src="http://i67.tinypic.com/20uv0vp.png" alt="cat" />
</div>
<div class="preview" align="center">
<img name="preview" src="http://i67.tinypic.com/20uv0vp.png" alt=""/>
</div>
</div>
</body>
</html>
最佳答案
试试这个
function forward()
{
which++;
if(which>photos.length-1)
{
which=0;
}
document.images.photoslider.src=photos[which];
}
function backward()
{
--which;
if(which<1)
{
which=photos.length-1;
}
document.images.photoslider.src=photos[which];
}
关于javascript - 尝试使用下一个和上一个按钮创建一个简单的 javascript 画廊以循环回到开头，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35284074/