JavaScript圖像滑塊/目錄

Question

因此，我正在嘗試制作一個簡單的圖像“目錄”，以便在其中循環顯示某些圖像。 這是代碼： http : //pastebin.com/raw/NDh4VBtz目前，我面臨兩個問題：

• 1. 第一次按下后如何使我正在使用的按鈕前進。 示例：我有3張圖片（IMG1，IMG2，IMG3）。 我想如下使用它們。 我按下按鈕“下一張圖片”：IMG1-> IMG2。 我再次按下按鈕：IMG2-> IMG3。 如果我按“上一張圖像”：IMG3-> IMG2。 在這一點上，我已經做到了，因此當我按下“下一張圖像”或“上一張圖像”時，它將可以首次使用。
• 2. 如何存儲圖像位置，以便當我再次調用該函數時，它不會丟失該值。 我正在使用onclick事件-onclick =“ imagesS（'Image'，'Text'，Images，-1）”。 圖片= imageID，文字= textID，圖片=圖片數組，-1 =方向。

文件的JavaScript部分：

 <script type="text/javascript">
     var Images = 
        new Array("first.jpg", "second.jpg", "third.jpg", 0)

     function imagesS(ImageId, TxtId, ImageArr, Direction) {
            IndPos = 0;
            if (Direction == "+1"){
                IndPos += 1;
                if (ImageArr.length == IndPos) {
                    alert("Last photo!");
                } else {
                    document.getElementById(ImageId).src= ImageArr[IndPos];
                    document.getElementById(TxtId).innerHTML = "Text: <i>" + ImageArr[IndPos] + "</i>";
                }
            }   else if (Direction == "-1"){
                    IndPos -= 1;
                    if (IndPos == "0" || IndPos == "-1"){
                        alert("Can't do that!");
                    }   else {
                    document.getElementById(ImageId).src= ImageArr[IndPos];
                    document.getElementById(TxtId).innerHTML = "Text: <i>" + ImageArr[IndPos] + "</i>";
                    }
                }

     } 

Answer 1

也許這樣的事情對您有用： imageCatalog