<!---Hide From Browsers that don't support JS
//Load up the images (NOTE: we add the nav images for the sub menus here as well - this is important as they are not on every page)
var shopBrown = new Image(35, 10);
shopBrown.src = "images/nav/shopBrown.gif";

var shopWhite = new Image(35, 10);
shopWhite.src = "images/nav/shopWhite.gif";

var stationeryBrown = new Image(75, 10);
stationeryBrown.src = "images/nav/stationeryBrown.gif";

var stationeryWhite = new Image(75, 10);
stationeryWhite.src = "images/nav/stationeryWhite.gif";

var invitationsBrown = new Image(79, 10);
invitationsBrown.src = "images/nav/invitationsBrown.gif";

var invitationsWhite = new Image(79, 10);
invitationsWhite.src = "images/nav/invitationsWhite.gif";

var babyBrown = new Image(32, 10);
babyBrown.src = "images/nav/babyBrown.gif";

var babyWhite = new Image(32, 10);
babyWhite.src = "images/nav/babyWhite.gif";

var aboutBrown = new Image(44, 10);
aboutBrown.src = "images/nav/aboutBrown.gif";

var aboutWhite = new Image(44, 10);
aboutWhite.src = "images/nav/aboutWhite.gif";

var contactBrown = new Image(60, 10);
contactBrown.src = "images/nav/contactBrown.gif";

var contactWhite = new Image(60, 10);
contactWhite.src = "images/nav/contactWhite.gif";

var blogBrown = new Image(35, 10);
blogBrown.src = "images/nav/blogBrown.gif";

var blogWhite = new Image(35, 10);
blogWhite.src = "images/nav/blogWhite.gif";


//Invitations sub menu
var weddingBrown = new Image(64, 15);
weddingBrown.src = "images/invitations/weddingBrown.gif";

var weddingGreen = new Image(64, 15);
weddingGreen.src = "images/invitations/weddingGreen.gif";

var cdBrown = new Image(106, 15);
cdBrown.src = "images/invitations/cdBrown.gif";

var cdGreen = new Image(106, 15);
cdGreen.src = "images/invitations/cdGreen.gif";


//Contact sub menu
var signUpBrown = new Image(51, 12);
signUpBrown.src = "images/signUp/signUpBrown.gif";

var signUpGreen = new Image(51, 12);
signUpGreen.src = "images/signUp/signUpGreen.gif";


//thumb squares
var square = new Image(12,12);
square.src = "images/square.gif";

var squareBordered = new Image(12,12);
squareBordered.src = "images/squareBordered.gif";


function swapIt(x,y)
{
    x.src = y.src;
    return true;
}


//the first square clicked on page load is always the first square
//boy, that comment is redundant.
var currentSelection = "img0";

function mainImageSwap(imgLink, x)
{
    //swap out the big image
    //reload the onmouseout event for the old square that was clicked
    //turn off the border on the old square that was clicked
    //set the current selection to the new square that is currently clicked
    
    document["mainImage"].src = imgLink;
    document[currentSelection].onmouseout = function(){swapIt(this, square);};
    document[currentSelection].src = square.src;
    currentSelection = x.name;

    return true;
}

function turnOnBorder(x)
{
    x.onmouseout = x.onmouseover;
    x.src = squareBordered.src;
}

//Stop the hiding------>