如何在最後或第一個圖像停止JavaScript php庫？

Question

我有一個簡單的jQuery和JavaScript圖像庫，使用PHP來收集圖像，並將它們放入li標籤。畫廊的工作（幾乎），並會左右通過圖像，但我不能讓他們停止在最後的權利，留在第一，他們只是不停地滾動。我的.js文件的代碼如下所示：

var currentImage = 1; 
var numImages = 0; 

$(document).ready(function(){ 

$('.rightbtn').click(function(){ 
     moveLeft(); 
}); 

$('.leftbtn').click(function(){ 
     moveRight(); 
}); 

$('.gallery-li').each(function(){ 
     numImages++; 
}); 

}); 

function moveLeft() 
{ 
    if (currentImage < numImages) 
    { 
    $('.gallery-ul').animate({ 'marginLeft' : '-=600px' } , 500, 'swing'); 
    $currentImage++; 
    } 
    if (currentImage > numImages) 
    { 
    $('.rightbtn').css('display' , 'none'); 
    } 
} 

function moveRight() 
{ 
    if (currentImage = 1) 
    { 
    $('.gallery-ul').animate({ 'marginLeft' : '+=600px' } , 500, 'swing'); 
    $currentImage--; 
    } 
    if (currentImage < 1) 
    { 
    $('.leftbtn').css('display' , 'none'); 
    } 
} 

而且我.PHP是這樣的：

 <ul class="gallery-ul"> 
     <?php 
     $files = glob("pics/interior/*.*"); 
     for ($i=1; $i<count($files); $i++) 
    { 
    $num = $files[$i]; 
    echo '<li class="gallery-li"><img src="'.$num.'" class="gallery-img"/></li>'; 
    } 
     ?> 
     </ul> 

有人可以告訴我，我做錯了嗎？

如果你想看看我在說什麼，我已經在服務器上登記了http://north49builders.com/gallery1.php。

謝謝！

Answer 1

更新Jquery代碼。

var currentImage = 1; 
var numImages = 0; 

$(document).ready(function(){ 

    $('.rightbtn').click(function(){ 
      moveLeft(); 
    }); 

    $('.leftbtn').click(function(){ 
      moveRight(); 
    }); 

    $('.gallery-li').each(function(){ 
      numImages++; 
    }); 
}); 

    function moveLeft() 
    { 
     if ((currentImage+1) == numImages) 
     { 
      $('.rightbtn').css('display' , 'none'); 
      $('.leftbtn').css('display' , 'block'); 
     }else{ 
      $('.rightbtn').css('display' , 'block'); 
      $('.leftbtn').css('display' , 'block'); 
     } 
     if (currentImage < numImages) 
     { 
      $('.gallery-ul').animate({ 'marginLeft' : '-=600px' } , 500, 'swing'); 
      currentImage++; 
     } 


    } 

    function moveRight() 
    { 

     if ((currentImage - 1) == 1) 
     { 
      $('.leftbtn').css('display' , 'none'); 
      $('.rightbtn').css('display' , 'block'); 
     }else{ 
      $('.leftbtn').css('display' , 'block'); 
      $('.rightbtn').css('display' , 'block'); 
     } 

     if (currentImage <= numImages) 
     { 
      $('.gallery-ul').animate({ 'marginLeft' : '+=600px' } , 500, 'swing'); 
      currentImage--; 
     } 

    } 

而在你html代碼從$添加此

<div class="leftbtn" style="display: none;">