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


i have simple jquery , javascript image gallery uses php gather images , put them in li tags. gallery works (almost) , go left , right through images, cannot them stop going right @ end , left on first, keep scrolling through nothing. .js code looks this:

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');     } } 

and .php looks this:

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

can please tell me i'm doing wrong?

i have on server @ http://north49builders.com/gallery1.php if want see i'm talking about.

thanks!

update jquery code this.

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--;         }      } 

and in html code add this

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

Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -