Howdy_McGee
Howdy_McGee

Reputation: 10635

Javascript OnMouseOver without attribute

I'm trying to trigger a javascript onMouseOver event without having the onMouseOver attribute on everyone of my anchor attributes. In reality I want to display some other anchors when the user mouses over an element, but I can't even get an alert to work. I keep getting the error of:

Uncaught TypeError: Cannot call method 'getElementsByTagName' of null

Which doesn't make sense to me because if I alert out the getElementById() I end up with a DIV element, which it should then get all the anchor tags inside that div element... Not sure what I am missing.

JSFiddle Link: http://jsfiddle.net/NfTtq/

Also note I am doing this Javascript not JQuery :S

Upvotes: 2

Views: 1094

Answers (4)

davorMar
davorMar

Reputation: 1

this code will work on all browsers.....

<p>
<a href="/">
<img alt="Ovdje uključiti " 
src="errorimages/normal.png" 
onmouseover="this.src='errorimages/hover.png'" 
onmousedown="this.src='errorimages/press.png'" 
onmouseup="this.src='errorimages/hover.png'" 
onmouseout="this.src='errorimages/normal.png'"
></a>
</p>

Upvotes: 0

Senad Meškin
Senad Meškin

Reputation: 13756

You are executing script before html is loaded, so you need to put it into window.onload

http://jsfiddle.net/NfTtq/5/

window.onload= function()
    {

      var node = document.getElementById('navFloat').getElementsByTagName('a');
      node[0].onmouseover = function()
        {
            alert('yes');
            document.getElementById('homeDrop').style.display = 'block';            
        }
}

Upvotes: 1

Gerd Riesselmann
Gerd Riesselmann

Reputation: 986

The onMouseDown event is written in small caps only, when invoked on the DOM. This worked for me:

var node = document.getElementById('navFloat').getElementsByTagName('a');
node[0].onmouseover= function()
{
    document.getElementById('homeDrop').style.display = 'block';
}

Upvotes: 0

Esailija
Esailija

Reputation: 140210

You are trying to find the element before it exists, you can do this in jsfiddle by selecting onDomReady from the left instead of no wrap (head)

The other problem is onMouseOver, javascript is case sensitive so only onmouseover will work.

Here is updated jsfiddle:

http://jsfiddle.net/NfTtq/1/

Upvotes: 3

Related Questions