Problem with event listener

JavaScript
1

Hello,

For some reason, I am having problems making an event fire on a particular element in my document. The same event listened in the same way fires on other elements, but not this one. There are no other events assigned to this element.

Here is my javascript:

function CallbackFunc(cfe){
        window.status = "Fired";
}

// option 1:
function onLoadFunc(){
        document.getElementById("main").addEventListener("click", CallbackFunc, false); //works as expected
}

// option 2:
function onLoadFunc(){
        document.getElementById("testmeter").addEventListener("click", CallbackFunc, false); //DOESN'T work, i.e. "Fired" won't show up in the status bar
}

and HTML:

...
<body onload="onLoadFunc();">
<div id="main"> <!-- a block element with relative positioning -->
...
<div id="testmeter"> <!-- a block element with absolute positioning -->
...
</div>
...
</div>
</body>
...

What do you think could be causing this problem? Thanks for any help!

2

It worked for me in Opera10. Which browser are you using? And are you aware of your browser’s developer tools, which will most likely include a script debugger?

Just out of interest’s sake, can you post the whole HTML file, CSS and all?

Cheers,
D.

3

Hmm, it actually does work in Opera! But not in Firefox of Safari :frowning:

Neither the Firefox nor the Safari javascript error consoles are reporting any problems.

I’ll get back with the HTML and CSS in a bit. Thanks for your help so far!

4

I think I just solved the problem! Assigning a “z-index” value to the div makes the event fire :slight_smile:

Thanks again for your support!