var js_site_url = "";
// JavaScript Document
function getFirstUnderscoreCss(element) 
{
	var cssArray = element.className.split(" ");
	for (var i in cssArray) 
	{
		if (cssArray[i].substring(0,1) == "_")
		{
			return cssArray[i].substring(1);
		}
	}	
	return "";
}

//super dooper sweet buttonmouseover function
//can be used for input or div
function button(action, element)
{
	if (action=="hover")
	{		
		element.style.background = "url(" + js_site_url + "pics/button_" + getFirstUnderscoreCss(element) + "_hover.png)";
	}
	else if (action=="up")
	{
		element.style.background = "url(" + js_site_url + "pics/button_" + getFirstUnderscoreCss(element) +"_up.png)";
	}
}

//for img buttons
function buttonImage(action, element)
{
	if (action=="hover")
	{		
		element.src= js_site_url + "pics/button_" + getFirstUnderscoreCss(element) + "_hover.png";
	}
	else if (action=="up")
	{
		element.src = js_site_url + "pics/button_" + getFirstUnderscoreCss(element) +"_up.png";
	}
}

/* Sample HTML Sample */
//<div class="broadband_form_submit">
////////<input type="submit" value="" class="localconnection_login _login" onMouseOver="button('hover',this);" onMouseOut="button('up',this);">
//</div>

//All button naming convention should be "button + _[class] + .png". Thus in our example above it should be "button_login.png"
//EX:
//<img src="pics/button_loginsubmit_up.png" class="_loginsubmit [other classes etc...]" onMouseOver="buttonImage('hover',this);" onMouseOut="buttonImage('up', this);"/>