nutso said:
If a div is positioned block or relative, events fire over the entire area
of the div. If the div is positioned absolute they don't--they only fire
over the div's text or image child elements, if any. This isn't true in FF
or Opera, nor was it true in IE 5. If there is any logic in this behavior,
please edify. It seems a bug to me.
nf
I think what you are asking is more a CSS question than JavaScript,
so if you want a better answer try:
comp.infosystems.
www.authoring.stylesheets
To see your DIV's dimensions, give it a border and (pale) background.
My take is that by default, DIV's take up the entire page width, but
are only as high as needed for their content. When you give them
position: absolute without any height or width, they will
shrink to fit the content both in width and height.
If you make them smaller than the content using width & height, and
allow the content to overlap the edges, clicking outside the DIV but
over the overlapping internal elements will still cause the div
onclick to fire because the event will bubble up the DOM unless you
stop it.
Events from overlapping elements that are not below the DIV in the
DOM will not bubble up into the div (z-index can influence which of
the overlapping elements gets the click in the first place).
The best idea is to create some simple divs, put onclicks on them,
move them around on the page and within the DOM and see what happens.
The sometimes conflicting view of the DOM structure versus the
position of displayed elements can be confusing - or am I making it
worse?