/* Rollover Functions

Chris Broumley <broumley@gmail.com>
July 19, 2006
License: GPL

At the bottom of the document, or in the onLoad event, use the AddRollOver() function
to add rollover images to image tags specified by ID's, and thats all there is to it.
Use the RollOver() function with the "this" operator on the image tag's onmouseout and onmouseover
attributes to enable drag and drop.

EXAMPLE:
<a class='menulink' href='index.php'><img id="1" src="button_mainmenu.jpg"></a>

<script type="text/javascript">
  AddRollOver('1', 'button_mainmenu_over.jpg');
</script>
*/

/**
 * Called after writing out the controls in question, this attaches the rollover events
 * to the object specified by the id
 */  
function AddRollOver(imageid, rolloverimage){
  obj = document.getElementById(imageid);
  document.getElementById(imageid).rollover = new Image();
  document.getElementById(imageid).rollover.src = rolloverimage;
  obj.onmouseover = event_handler_rollover;
  obj.onmouseout = event_handler_rollover;
}//function

/**
 * Event Handler Function:
 * Swaps the rollover.src with the src of the elementid
 */  
function event_handler_rollover(e){
	if (!e) var e = window.event
	var tmp = this.src;
  this.src = this.rollover.src;
  this.rollover.src = tmp;
}//function

