/*
	Standards Compliant Rollover Script
	Author : Daniel Nolan + bbh etudes et developpement (DB)
	http://www.bleedingego.co.uk/webdev.php

	DB: usage is extremely easy:
		(1) image must have the class="imgover", ex <img ... class="imgover">
		(2) the images must have the same base name +- '_o' suffix, ex 'logo.gif' and 'logo_o.gif'

	DB: add 3rd image management. 

	DB: To automatically link a 3rd image to the current one, simply:
		(1) give a name to the master image, ex <img ... name="logo"> (and class="imgover")
		(2) give class="img3" to the slave image
		(3) and the same name plus a '_3' suffix to the slave image, ex <img ... name="logo_3">
	Ex:
		<img src="rollover.gif" alt="Rollover Sample" class="imgover" name="master">
		<img src="otherimage.gif" alt="Trying third" class="img3" name="master_3">
	and on disk we have these images:
		rollover.gif
		rollover_o.gif
		otherimage.gif
		otherimage_o.gif
*/

function initRollovers() 
{
	if (!document.getElementById)
		return;
	
	var aPreLoad = new Array();
	var sTempSrc;
	var aImages = document.getElementsByTagName('img');

	for (var i = 0; i < aImages.length; i++) 
	{
		if (aImages[i].className == 'imgover') 
		{
			var src = aImages[i].getAttribute('src');
			var ftype = src.substring(src.lastIndexOf('.'), src.length);
			var hsrc = src.replace(ftype, '_o'+ftype);

			aImages[i].setAttribute('hsrc', hsrc);
			aImages[i].setAttribute('img3', 'none');
			
			aPreLoad[i] = new Image();
			aPreLoad[i].src = hsrc;

			if (aImages[i].name != '') // DB: use names to link to 3rd image
			{
				thirdImageName = aImages[i].name + '_3';
				thirdImage = document[thirdImageName];

				if (thirdImage.className == 'img3') 
				{
					var src3 = thirdImage.getAttribute('src');
					var ftype3 = src3.substring(src3.lastIndexOf('.'), src3.length);
					var hsrc3 = src3.replace(ftype3, '_o'+ftype3);

					aImages[i].setAttribute('img3', thirdImage.name);

					thirdImage.setAttribute('hsrc3', hsrc3);
				}
			}

			aImages[i].onmouseover = function() 
			{
				sTempSrc = this.getAttribute('src');
				this.setAttribute('src', this.getAttribute('hsrc'));

				if (this.getAttribute('img3') != 'none')
				{
					thirdImage = document[this.getAttribute('img3')];
					sTempSrc3 = thirdImage.getAttribute('src');
					thirdImage.setAttribute('src', thirdImage.getAttribute('hsrc3'));
				}
			}
			
			aImages[i].onmouseout = function() 
			{
				if (!sTempSrc)
					sTempSrc = this.getAttribute('src').replace('_o'+ftype, ftype);
				this.setAttribute('src', sTempSrc);

				if (this.getAttribute('img3') != 'none')
				{
					thirdImage = document[this.getAttribute('img3')];
					if (!sTempSrc3)
						sTempSrc3 = thirdImage.getAttribute('src').replace('_o'+ftype3, ftype3);
					thirdImage.setAttribute('src', sTempSrc3);
				}
			}
		}
	}
}

window.onload = initRollovers;