Need help with an Image selection script

[NJacobi]

Hello, this is my first post, and it looks like there's no better place to find an answer.

My problem is this:
I made a photoalbum that allows you to browse our photos both backwards and forwards. Also, when you select a thumbnail, the larger image is displayed above. Here's the page as it is now:
http://www.rtaautomation.com/photoalbum

For awhile, we just had three images and the script worked great. But now, I need to add more pictures, but the script doesn't seem to allow you to go past the third image. If you manually select the 4th image, you're able to go backwards, but something isn't allowing the user to go forward and view all the images. Here is the code:

// List image names without extension
var myImg= new Array(3)
  myImg[0]= "pix1";
  myImg[1]= "pix2";
  myImg[2]= "pix3";
  myImg[3]= "pix4";
// Tell browser where to find the image
myImgSrc = "images/";

// Tell browser the type of file
myImgEnd = ".jpg"

var i = 0;

// Create function to load image
function loadImg(){
  document.imgSrc.src = myImgSrc + myImg[i] + myImgEnd;
}

// Create link function to switch image backward
function prev(){
  if(i<1){
    var l = i
  } else {
    var l = i-=1;
  }
  document.imgSrc.src = myImgSrc + myImg[l] + myImgEnd;
}

// Create link function to switch image forward
function next(){
  if(i>1){
    var l = i
  } else {
    var l = i+=1;
  }
  document.imgSrc.src = myImgSrc + myImg[l] + myImgEnd;
}
// Load function after page loads
window.onload=loadImg;

Anybody see what might be causing the problem?

Thanks!

[Old Pedant]

I saw this code at the time and didn't like it. Almost told you about it then. Guess I should have.

Here:

// don't give a size for the image array...let it be self-sizing:
var myImg= [ 
   "pix1",
   "pix2",
   "pix3",
   "pix4",
   "pix5"
   ];

// use a more meaningful variable name...
// one that is not likely to be used for other purposes 
var currentImage = 0;

// Create function to load image
function loadImg()
{
    // this is the only place where "images/" and ".jpg" are used, 
    // so why bother with the global variables???
    document.imgSrc.src = "images/ + myImg[currentImage] + ".jpg";
}

// Create link function to switch image backward
function prev()
{
    currentImage = ( currentImage + myImg.length - 1 ) % myImg.length;
    loadImg( );
}
// Create link function to switch image forward
function next()
{
    currentImage = ( currentImage + 1 ) % myImg.length;
    loadImg( );
}


// Load function after page loads
window.onload=loadImg;

NOTE: This will give you a circular slide show. If the user clicks next when last image is showing, it will go back to the first image. If the user clicks prior when first image is showing, it will go to the last image.

If you don't want a circular show, just ask.

[NJacobi]

Thanks a bunch, I'll give it a try sometime tonight. I'm assuming it's going to work, so thanks a bunch for the time saver.