0

我正在尝试将上一个和 fwd 按钮连接到画廊，我希望上一个按钮隐藏在画廊的第一张图片上，但 javascript 似乎根本不起作用。

Javascript

var imageGallery = new Array();
imageGallery[0] = '1.png';
imageGallery[1] = '2.png';
imageGallery[2] = '3.png';
imageGallery[3] = '4.png';
imageGallery[4] = '5.png';
var imgCount = 0;
function next() {
    imgCount++ ;
    document.getElementById("gallery").src = imageGallery[imgCount] ;
}

function previous() {
    imgCount--;
    document.getElementById("gallery").src = imageGallery[imgCount] ;   
    }

if(document.getElementById("gallery").getAttribute("src") == "1.png")
    {
    document.getElementById("previous").style.visibility = 'hidden';
    }
else 
    {
    document.getElementById("previous").style.visibility = 'visible';
    }

HTML

<div id="img">
<img id="gallery" src="1.png" style="height:420px; width:744px" >
<div id="imgNav">
    <a id="previous" href onclick="previous(); return false;">previous</a>
    <span style="color:#666; font-size:0.9em"> | </Span>
 <a id="next" href onclick="next(); return false;">next</a>
</div>
</div>

实际上，逻辑是如果 id 'gallery' 的 'src' 属性是 '1.png'，那么 id 为 'previous' 的元素的 'visibility' 是 'hidden' 否则不是但似乎不起作用。任何人都可以帮助弄清楚它。

4

1 回答 1

1

您可能正在尝试检查尚未完全加载的图像。您是否记得在页面完全加载时放置代码以运行（如果它放置在页眉中 - 您没有提到它是否是）？

更新

var imageGallery = new Array();
imageGallery[0] = '1.png';
imageGallery[1] = '2.png';
imageGallery[2] = '3.png';
imageGallery[3] = '4.png';
imageGallery[4] = '5.png';

var imgCount = 0;

function checkNav() {
    var previousLnk = document.getElementById("previous");
    var nextLnk = document.getElementById("next");

    previousLnk.style.visibility = imgCount == 0 ? 'hidden' : 'visible';
    nextLnk.style.visibility = imgCount >= (imageGallery.length - 1) ? 'hidden' : 'visible';
}

function setImg() {
    var gallery = document.getElementById("gallery");

    gallery.src = imageGallery[imgCount];
}

function next() {
    imgCount++;
    setImg();
    checkNav();
}

function previous() {
    imgCount--;
    setImg();
    checkNav();
}

window.onload = function () {
    checkNav();
}

演示：http: //jsfiddle.net/N7V9E/

于 2013-10-14T14:31:56.503 回答