// CSS and DHTML powered ImageGallery  
// Created in April 2004 by Dasme - dasme *at* dasme.org
//  - http://dasme.org/imagegal/
//
// Script based on ideas from Jeremy Keith and AListApart.com
// http://www.alistapart.com/articles/imagegallery/
//
// If you use this code in your page, please leave these comments in.
// A quick email with the location of your gallery would be cool too. 
// I always like to see what others have done with my scripts.
//

function DOMCall(name) {
	if (document.layers) 
		return document.layers[name];
	else if (document.all)
		return document.all[name];
	else if (document.getElementById)
		return document.getElementById(name);
}

function initImage() {
	imageId = 'placeholder';
	image = document.getElementById(imageId);
	setOpacity(image, 0);
	image.style.visibility = "visible";
	fadeIn(imageId,0);
}

function fadeIn(objId,opacity) {
	if (document.getElementById) {
		obj = document.getElementById(objId);
		if (opacity <= 100) {
			setOpacity(obj, opacity);
			opacity += 10;
			window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 20);
		}
	}
}

function fadeOut(objId,opacity) {
	if (document.getElementById) {
		obj = document.getElementById(objId);
		if (opacity >= 10) {
			setOpacity(obj, opacity);
			opacity -= 10;
			window.setTimeout("fadeOut('"+objId+"',"+opacity+")", 20);
		}
	}
}
function setOpacity(obj, opacity) {
	opacity = (opacity == 100)?99.999:opacity;
	// IE/Win
	obj.style.filter = "alpha(opacity:"+opacity+")";
	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;
	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;
	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}

function showPic1 (whichpic) {
	DOMCall('placeholder').src = whichpic.src;
	DOMCall('placeholder').src = DOMCall('placeholder').src.replace("/thumb/", "/");
	initImage();
	var elemid = whichpic.id;
	elemid = elemid.replace("popcopy", "");
	var caption = document.getElementById(elemid).getAttribute('desc')
	if (caption) {
		DOMCall('imageCaptionRight').className = "hidden";
		DOMCall('imageCaptionBottomLeft').className = "hidden";
		DOMCall('imageCaptionLeft').innerHTML = caption;
		DOMCall('imageCaptionLeft').className = "";
	} else {
		DOMCall('imageCaptionLeft').className = "hidden";
		DOMCall('imageCaptionRight').className = "hidden";
		DOMCall('imageCaptionBottomLeft').className = "hidden";
	}
 	return false;
}

function showPic2 (whichpic) {
	DOMCall('placeholder').src = whichpic.src;
	DOMCall('placeholder').src = DOMCall('placeholder').src.replace("/thumb/", "/");
	initImage();
	var elemid = whichpic.id;
	elemid = elemid.replace("popcopy", "");
	var caption = document.getElementById(elemid).getAttribute('desc')
	if (caption) {
		DOMCall('imageCaptionLeft').className = "hidden";
		DOMCall('imageCaptionBottomLeft').className = "hidden";
		DOMCall('imageCaptionRight').innerHTML = caption;
		DOMCall('imageCaptionRight').className = "";
	} else {
		DOMCall('imageCaptionLeft').className = "hidden";
		DOMCall('imageCaptionRight').className = "hidden";
		DOMCall('imageCaptionBottomLeft').className = "hidden";
	}
 	return false;
}

/*
function clickedImage (whichpic) {
	imageUrl = whichpic.src;  // grab the url of the medium image.
	imageUrl = imageUrl.replace(/fall2007/gi, "fall2007/large"); // add in the "large" dir so we can display the big picture
	imageWindow = window.open("popup.php?z="+imageUrl,'imageWin','width=640,height=480');  // popup the image in a new window set width and height to your max values
}
*/


function switchPage(pageId) {
DOMCall('page1').className = "hidden";
DOMCall('page2').className = "hidden";
DOMCall('page3').className = "hidden";
DOMCall('page4').className = "hidden";
DOMCall(pageId).className = "visible"; // set the current page to junk so it becomes visible
}

/* FOR NAVIGATION TOP BAR DROP DOWNS IE6 COMPATIBILITY*/
<!--
sfHover = function() {
	if (!document.getElementsByTagName) return false;
	var sfEls = document.getElementById("nav").getElementsByTagName("li");
	// if you only have one main menu - delete the line below //
	var sfEls1 = document.getElementById("secnav").getElementsByTagName("li");
	//
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
	// if you only have one main menu - delete the "for" loop below //
	for (var i=0; i<sfEls1.length; i++) {
		sfEls1[i].onmouseover=function() {
			this.className+=" sfhover1";
		}
		sfEls1[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover1\\b"), "");
		}
	}
	//
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//-->