/* 

	Created by: Sean Downey, downeywebdev.com
	Changes images to have a hover over image just by setting a class name
	Based off of: Image Link by Alen Grakalic
	
	
*/

this.setHoverEvents = function(){
	
	// CONFIG
		
	
	/*
	 * css class of images that you want to apply this script to
	 * if you want to apply this script to all images inside anchor tags, leave this string blank
	 */
	var imageClass = "hover";
	
	/*
	 * Term right before the extension,
	 *	if this is '_hover' your files should be named:
	 *  image.jpg and image_hover.jpg
	 */
	var hoverTerm = "_hover";
	


	// END CONFIG
	
	var imageTags = document.getElementsByTagName("img");
	var hoverTermPos, extenionPos;
	for (var i=0;i<imageTags.length;i++){		
		if(imageTags[i].className == imageClass || imageClass == ""){
			imageTags[i].onmouseover = function(){
				extenionPos = this.src.lastIndexOf('.');
				this.src = this.src.substr(0, extenionPos) + hoverTerm + this.src.substr(extenionPos);
			};
			imageTags[i].onmouseout = function(){
				hoverTermPos = this.src.indexOf(hoverTerm);
				this.src = this.src.substr(0, hoverTermPos) + this.src.substr(hoverTermPos + hoverTerm.length);
			};		
		};
	};

};



// script initiates on page load. 

this.addEvent = function(obj,type,fn){
	if(obj.attachEvent){
		obj['e'+type+fn] = fn;
		obj[type+fn] = function(){obj['e'+type+fn](window.event );}
		obj.attachEvent('on'+type, obj[type+fn]);
	} else {
		obj.addEventListener(type,fn,false);
	};
};
addEvent(window,"load",setHoverEvents);
addEvent(window,"resize",setHoverEvents);