我如何停止javascript php库在最后或第一个图像 - How do I stop javascript php gallery at last or first image?

How do I stop javascript php gallery at last or first image?

我有一个简单的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如果你想看看我在说什么。

谢谢!

将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;">