/*
EXAMPLE USAGE:

<script type="text/javascript" src="../Scripts/jquery.rollovers.js"></script>
<div id="Rollover">
    <a href="../Demo/Microstage.aspx" title="Microstage"><img src="../Images/Featured/Microstage.jpg" alt="" style="border: none;" /></a>
</div>
*/

$(document).ready(function() {
	// Preload all rollovers
	$("#Rollover img").each(function() {
		// Set the original src
		rollsrc = $(this).attr("src");
		rollON = rollsrc.replace(/.jpg$/ig, "_Over.jpg");
		rollON = rollsrc.replace(/.gif$/ig, "_Over.gif");
		$("<img>").attr("src", rollON);
	});

	// Navigation rollovers
	$("#Rollover a").mouseover(function(){
		imgsrc = $(this).children("img").attr("src");
		matches = imgsrc.match(/Rollover/);
		
		// don't do the rollover if state is already ON
		if (!matches) {
		    imgsrcON = imgsrc.replace(/.jpg$/ig, "_Over.jpg"); // strip off extension
		    imgsrcON = imgsrc.replace(/.gif$/ig, "_Over.gif"); // strip off extension
		    $(this).children("img").attr("src", imgsrcON);
		}
	});

	// Navigation rollout
	$("#Rollover a").mouseout(function(){
		$(this).children("img").attr("src", imgsrc);
	});
});