[JS] Mouseover van een laag onder een laag?

[Freak_NL]

Waarde script-goeroes,

Ik loop met een drag & drop implementatie in Javascript op een XHTML 1.1 pagina tegen het volgende probleem aan. Er is een div waarin een aantal versleepbare elementen staan. Wanneer zo'n element vesleept wordt, dan verdwijnt dat element tijdelijk en wordt in een laag erboven een kleine laag aangemaakt die als icoon door de mouse-pointer meegesleept wordt. Tot zover heb ik dat werkend:

Op deze website staat geen PHP5, waardoor ik de twee varianten die gegeneerd worden even apart on-line neerzet. Vanuit de oorspronkelijke PHP5-pagina wordt automatisch bekeken of een browser application/xhtml+xml begrijpt:

• http://www.jeroenhoek.nl/divtest/normaal.xhtml
• http://www.jeroenhoek.nl/divtest/ie.html

Voor Internet Explorer 6 moet je de tweede link hebben.

Nu wil ik dat er tijdens het verslepen door middel van een tijdelijk plaatje aangegeven wordt waar de versleepte laag weer ingevoegd wordt zodra je deze loslaat. Daarvoor moet ik weten boven welke laag ik op dat moment hang met dat icoontje.

Het probleem is dat een mouseover niet lijkt te werken, omdat er al een div direct onder de mouse-pointer zit. Ook als ik de mouseover eventhandler van dat icoontje weghaal. Is er een manier om toch met een mouseover event de identiteit van de onderliggende lagen te weten te komen? Of kan ik beter een andere oplossing zoeken?

[André]

Volgens mij kun je beter aan de slag gaan met een collision detector zodat je aan de hand van de coordinaten kan bepalen waar je boven hangt met je object.

Mouseovers worden wel gebubbled naar de parents van je object maar aangezien je object andere parents heeft dan de container waar je boven hangt zal die het event niet ontvangen.