MouseOver Style Change

[Xaus]

Hi all,

This has been really puzzling me for quite a while now, and I'm still not entirely sure what to search for so I can't find the answer I'm looking for.

I'm trying to create a rollover (on an image - if that helps) which will change the style ID of another component (in this case a TD id). I'm sure that this must be possible, but I can't find out how.

If someone could post some example code, or maybe what I need to look for that would be great. Thanks in advance!

**SOLVED**

I found the solution! I was looking for document.className Sorry for this useless post.

[Ramsonne]

I'm stuck on this same topic. Could you provide me with what worked for you?

What im trying to do is have the style.color (text color) change in a separate <div> when I hover over a link image.

[ItsMeOnly]

Moz/Firefox/probably Opera

myDiv:hover {
color: orange
}

IE
div onmouseover="this.style.color: orange"

[Ramsonne]

thanks for the response. but what im am trying to achieve is not a local color change. when you mouseover one div, i want it to change props in another div.

[Jfis]

thanks for the response. but what im am trying to achieve is not a local color change. when you mouseover one div, i want it to change props in another div.

I am looking for the same sort of thing and am wondering did you ever find a way to do this?

[Jfis]

I realize this is an old post. However when I came accross it and did not find an answer to this persons question nor mine. So I though I would post what worked for me. The orig member may no longer need it but hopfully it will help someone else.

I came up with something like this if you have not found a solution maybe this will help.

In my the header I placed this script where marquee_replacement is the style I am trying to change and eg. width='220px' is the property i want changed
<script type="text/javascript">
function changeBox() {
document.all.marquee_replacement.style.width='220px';
document.all.marquee_replacement.style.height='150px';
}
</script>

then in the tag where I needed the change say onClick I just added the javascript call eg.

<img src="images/pic.jpg" onMouseOver="changeBox();">

and I havent tried to return it to the original state but I would guess that you could add another function to the javascipt. Asmost exactly the same as the first but with the original styles then in the same tag call it with a onMouseOut eg.

<img src="images/pic.jpg" onMouseOver="changeBox();" onMouseOut="changeback();">

When I did this one thing to note is that for it to work the style I was trying to change had to be in the header of the page rather than a seperate style sheet.

Using this method I was able to change the css style of another part of the page using a javascript call from the the tag of another place on the page. In my own case it was an odd situation where I called it from using the onload event from the page body tag. But I am pretty sure sure it would work for the type of thing the person above was trying to figure out.