DHTML Problem with DIV and OnMouseOver

J

John Smith

I have a DIV element containing some text. I have onmouseover and on
mouseout events declared. However, the onmouseover event only fires with the
mouse is over the actual text, and not the div as a whole. I have tried
setting the div style to display:block, but it makes no difference. Any
ideas?

<DIV id='divTest' OnMouseOver='changeColor()' OnMouseOut='revertColor()'>
Hello, this is some test text!
</DIV>

javascript:

function changeColor(){
document.all('divTest').style.backgroundColor='red';
}

function revertColor(){
document.all('divTest').style.backgroundColor='blue';
}
 
A

altamir

I have a DIV element containing some text. I have onmouseover and on
mouseout events declared. However, the onmouseover event only fires
with the mouse is over the actual text, and not the div as a whole. I
have tried setting the div style to display:block, but it makes no
difference. Any ideas?

which browser, which version?

<DIV id='divTest' OnMouseOver='changeColor()'
OnMouseOut='revertColor()'>
Hello, this is some test text!
</DIV>

try

<div onmouseover="this.style.backgroundColor='red'" ... >
....
javascript:

function changeColor(){
document.all('divTest').style.backgroundColor='red';
}

document.all is a microsoft idea. it's better to have
document.getElementById('divTest').style.backgroundColor='red' which is
supported in most of the modern browsers.
 
J

John Smith

Thanks. I'm using IE6. The example I gave actually works fine but my real
code doesn't, and I'm not sure what the difference is. My actual code is:

<div id="chartmenu" class="ContextMenu" style="VISIBILITY:hidden"
ONMOUSEOUT="this.tid = setTimeout('chartmenuhide(event)', 900);"
ONMOUSEOVER="clearTimeout(this.tid);">
<div class="ContextMenuItem" id="ChartMenuItemAdd"
onMouseover="chartmenuhighlight(event)"
onMouseout="chartmenulowlight(event)">
Add to Graph
</div>
</div>

The onMouseover="chartmenuhighlight(event)" only fires when I'm over the
'Add to Graph' text.
 
R

Richard

which browser, which version?


<div onmouseover="this.style.backgroundColor='red'" ... >
...
</div>

Works better with just "background".
I tested yours out and got nothing.


document.all is a microsoft idea. it's better to have
document.getElementById('divTest').style.backgroundColor='red' which is
supported in most of the modern browsers.
 
A

altamir

Thanks. I'm using IE6. The example I gave actually works fine but my real
code doesn't, and I'm not sure what the difference is. My actual code is:

<div id="chartmenu" class="ContextMenu" style="VISIBILITY:hidden"
ONMOUSEOUT="this.tid = setTimeout('chartmenuhide(event)', 900);"
ONMOUSEOVER="clearTimeout(this.tid);">
<div class="ContextMenuItem" id="ChartMenuItemAdd"
onMouseover="chartmenuhighlight(event)"
onMouseout="chartmenulowlight(event)">
Add to Graph
</div>
</div>

i guess it's time to change a group to comp.lang.javascript
 
A

altamir

Works better with just "background".
I tested yours out and got nothing.

maybe. depends on the browser. but as usual it's better to keep to the
standards.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top