0byt3m1n1

Path: /data/applications/aps.bak/b2evolution/4.1.5b-1.bak/standard/htdocs/rsc/js/ [ Home ]
File: rollovers.js
/**
 * Original Source: Book: DHTML Utopia: Modern Web Design Using JavaScript & DOM
 * Also: http://www.sitepoint.com/article/dhtml-utopia-modern-web-design/2
 */

/**
 * Automagically set up rollover event handlers for all IMGs within links with the rollover class
 *
 * This is executed once after page load
 *
 * @todo preload rollover images?
 */
function setupRollovers()
{
	if(!document.getElementsByTagName)
	{ // We are NOT in a DOM-supporting browser:
		return;
	}

	// Get ALL the links in the current document:
	var all_links = document.getElementsByTagName('a');

	// Go through all the links:
	for(var i = 0; i < all_links.length; i++)
	{
		var link = all_links[i];
		if(link.className && (' ' + link.className + ' ').indexOf(' rollover ') != -1)
		{ // The link has the rollover class (among potentially other classes):
			// Set up event handlers:
			link.onmouseover = mouseover;
			link.onmouseout = mouseout;
		}
	}
}


/**
 * caters for the differences between Internet Explorer and fully DOM-supporting browsers
 */
function findTarget(e)
{
 var target;

 if (window.event && window.event.srcElement)
   target = window.event.srcElement;
 else if (e && e.target)
   target = e.target;
 if (!target)
   return null;

 while (target != document.body &&
     target.nodeName.toLowerCase() != 'a')
   target = target.parentNode;

 if (target.nodeName.toLowerCase() != 'a')
   return null;

 return target;
}


/**
 * MouseOver event handler
 */
function mouseover(e)
{
	var target = findTarget(e);
	if (!target) return;

	var img_tag = target.childNodes[0];
	if( img_tag.nodeName.toLowerCase() != 'img')
	{
		img_tag = target.childNodes[1];
	}

	// Take the "src", which names an image called "something.ext",
	// Make it point to "something_over.ext"
	img_tag.src = img_tag.src.replace(/(\.[^.]+)$/, '_over$1');
}


/**
 * MouseOut event handler
 */
function mouseout(e)
{
	var target = findTarget(e);
	if (!target) return;

	var img_tag = target.childNodes[0];
	if( img_tag.nodeName.toLowerCase() != 'img')
	{
		img_tag = target.childNodes[1];
	}

	// Take the "src", which names an image as "something_over.ext",
	// Make it point to "something.ext"
	img_tag.src = img_tag.src.replace(/_over(\.[^.]+)$/, '$1');
}


/**
 * When the page loads, set up the rollovers
 */
addEvent( window, 'load', setupRollovers, false );