...

View Full Version : onMouseOver/Out: can it be changed using JS?



cary67
11-01-2004, 11:41 PM
This seems like it should be easy, but I am obviously missing something. I would greatly appreciate any insight anyone could offer.

Let's say I have a TableData object that looks like this when the page loads:


<td id="apptab" width="20%" bgcolor="white" class="cellbox" align="center" onMouseOver="this.style.background='blue'" onMouseOut="this.style.background='white'"> <b>App</b></td>


Is it possible to use JS to change the value of the onMouseOver and onMouseOut events? In other words, could I call a script from the onClick event of some other page element that would execute the following code, changing the properties of the onMouseOver event without reloading the page?


document.getElementById("apptab").onMouseOver="this.style.background='green'";


The above code does not work and I don't know why. It also does not return any error.

Thanks a bunch!

Willy Duitt
11-02-2004, 12:47 AM
If you are going to try to change the style properties use style (background-color) not bgcolor which was long ago deprecated....

Also, javascript uses the camelCase naming convention when referencing hyphenated properties.... EG: background-color == backgroundColor....

Lastly, it is onmouseover (lowercase) not onMouseOver (mixed case)... although most browsers will still properly assign, your pages will not validate for anything other than HTML 3.1 or whatever....



<table><tr>
<td id="apptab" style="width:20%;background-color:white;text-align:center"
onmouseover="this.style.backgroundColor='blue'" onmouseout="this.style.backgroundColor='white'"> <b>App</b></td>
</tr></table>
<a href="#" onclick="document.getElementById('apptab').onmouseover=function(){alert('this is a new function')}">Change apptab onmouseover function</a>


.....Willy

cary67
11-02-2004, 06:50 PM
many thanks!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum