Hello,
I've programmed the following small script that changes the color of a table column during a "onmouseover" event and on "onclick" event. Everything works find EXCEPT I need the "onclick" color to hold even after the mouse moves away. The problem is the "onmouseout" is over rides the "onclick" when the mouse moves away.
Does anyone know how to keep the "onmouseclick" color displaying after the mouse clicks and then moves away? The goal is to change the table column back to white if there is a "onmouseover" and NO click. This part works fine. I just need to figure out out to HOLD the "onmouseclick" even after the mouse moves away. Any help would be well appreciated.
<head>
<script type="text/javascript">
function roll(obj)
{
var tobj=document.getElementById('column')
obj.style.backgroundColor = "#EEEEEE";
obj.style.border = "1";
obj.style.bordercolor = "#BBBBBB";
}
function rollout(obj)
{
var tobj=document.getElementById('column')
obj.style.backgroundColor = "#FFFFFF";
obj.style.border = "0px";
obj.style.bordercolor = "#FFFFFF";
}
function theclick(obj)
{
var tobj=document.getElementById('column')
obj.style.backgroundColor = "#FFFFCC";
obj.style.border = "1";
obj.style.bordercolor = "#FFCC33";
}
</script>
</head>
<body>
<table ALIGN="CENTER" cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="column" valign="top" width="25%" onmouseover="roll(this)" onmouseout="rollout(this)" onclick="theclick(this)">
</tr>
</table>
</body>
</html>
I've programmed the following small script that changes the color of a table column during a "onmouseover" event and on "onclick" event. Everything works find EXCEPT I need the "onclick" color to hold even after the mouse moves away. The problem is the "onmouseout" is over rides the "onclick" when the mouse moves away.
Does anyone know how to keep the "onmouseclick" color displaying after the mouse clicks and then moves away? The goal is to change the table column back to white if there is a "onmouseover" and NO click. This part works fine. I just need to figure out out to HOLD the "onmouseclick" even after the mouse moves away. Any help would be well appreciated.
<head>
<script type="text/javascript">
function roll(obj)
{
var tobj=document.getElementById('column')
obj.style.backgroundColor = "#EEEEEE";
obj.style.border = "1";
obj.style.bordercolor = "#BBBBBB";
}
function rollout(obj)
{
var tobj=document.getElementById('column')
obj.style.backgroundColor = "#FFFFFF";
obj.style.border = "0px";
obj.style.bordercolor = "#FFFFFF";
}
function theclick(obj)
{
var tobj=document.getElementById('column')
obj.style.backgroundColor = "#FFFFCC";
obj.style.border = "1";
obj.style.bordercolor = "#FFCC33";
}
</script>
</head>
<body>
<table ALIGN="CENTER" cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="column" valign="top" width="25%" onmouseover="roll(this)" onmouseout="rollout(this)" onclick="theclick(this)">
</tr>
</table>
</body>
</html>