i have a page that can create different reports based on user input. I want to show the user which report they are trying to create by changing the bgcolor of its div. When the page loads, it should change the bgcolor of the default report div...so the user knows that report is selected. The user can mouseover other report divs which will highlight their div and if the user clicks the link in the div, the page changes and the report that was clicked stays highlighted.
i wrote the following code, but its not working properly. The default report is not highlighted. The mouseover highlight works, but the mouseout "unhighlight" does not. Also, im having a hard time figuring out which report is selected
Code:
<script>
function highlight(a) {
//alert(a.style.backgroundColor);
if (a.style.backgroundColor="#CCCCCC")
a.style.backgroundColor="#FFFFCC";
else
a.style.backgroundColor="#CCCCCC";
}
function shaderpt(a) {
switch (window.location) {
case /faxes_sent/:
document.getElementById("faxes_sent").style.backgroundColor="#FFFFCC";
break;
case /md_nb_count/:
document.getElementById("md_nb_count").style.backgroundColor="#FFFFCC";
break;
}
}</script>
...
<tr>
<td rowspan=5><div id=faxes_sent onmouseover=highlight(document.getElementById("faxes_sent"))
onmouseout=highlight(document.getElementById("faxes_sent"))
style=shaderpt(document.getElementById("faxes_sent"))>
?description=faxes_sent">Faxes Sent</div>
<div id=md_nb_count onmouseover=highlight(document.getElementById("md_nb_count"))
onmouseout=highlight(document.getElementById("md_nb_count"))
style=shaderpt(document.getElementById("md_nb_count"))>
?description=md_nb_count">MD NB Count</div>
</td>
</tr>
here's a pic