I believe this should be an easy one.

I have 2 positioned layers one on top of the other.
I want an event to take place when the mouse is over the bottom layer, even if that means that the mouse will be over the top layer also.
If i use something like:
<div id="bottom" onmouseover="al()">This is my bottom div</div>
It works without a problem.
But if i remove the inline event handler, and i try to capture the event in a script in the head of my document, it doesn't work anymore. It works only if the mouse is DIRECTLY ontop of the bottom div, but if the top div is "between" the bottom div and the mouse pointer it doesn't work.
Here are the examples: this works doesn't work

In the second page, to activate the event you have to point directly on the bottom div (yellow area), otherwise it doesn't work.