onMouseout fordítva működik

Internet: PHP, CGI, stb.

Hi all

legördülő listát akarok csinálni és alakulgat is de van egy furcsa gondom. 


div.ddd { 
	border: 1px solid lime;
	display:none;
	width: 300px;
	}

...
function showList(id){
	var list = document.getElementById(id);
	list.style.display = 'block';

}

...

input id="ddlhead" type="text" class="ddt" onMouseOver="showList('ddd');"></br>
div name="ddd" id="ddd" class="ddd" onMouseOut="this.style.display='none';">

A fent látható kódrészek tartalmazzák a lényeget , nos nekem az a gondom hogy amikor a div fölé viszem a mutatót akkor eltűnik holott akkor kéne eltűnnie mikor elviszem róla a mutatót.
Tehát föléviszem a textboxynak akor megjelenik de mihelyt rávinnéma mutatót akkor eltűnik.

Valami ötlet hogy mi okozza ezt a viselkedést?
Vagy ha ez szabvány működés akkor szívesen fogadnék valami magyarázatot vagy segítséget hogy hogy ehet megoldani.

Köszönöm

  • 1486 megtekintés

( mn3monic v | 2011. 04. 04., h – 14:27 )

tipp: szerintem mikozben a ddlhead-rol atlepsz a ddd-re, vagy magan a ddd-n egy masik elem fole erkezik az eger, ami triggereli a ddd onmouseout-jat.

( bacsi2 | 2011. 04. 04., h – 14:32 )

Nálam működik, így próbáltam.

Tehát ha az input fölé viszem az egeret, megjelenik a div.
A div fölé tudom vinni az egeret, nem történik semmi.
Ha a div fölül elviszem az egeret, eltűnik a div.

Chrome alatt néztem csak.

( bacsi2 | 2011. 04. 04., h – 15:22 )

Így nem működik? Nálam Chrome, FF alatt megy. A div-ben lévő tartalom köré raktam padding-et, így ha a böngésző úgy jelenítené meg, hogy az input meg a div között van hely, akkor is megy.

Úgy érted, hogy azért tűnik el a div, mert az input fölül elviszi az egeret egy másik elemre ("Mert az már egy másik elem?")?

onMouseOver="showList('ddd');

Tehát ha az input fölött van az egér, akkor megjeleníti a ddd div-et. De! Ha elviszi fölüle, akkor az nem tűnik el magától, azért van a ddd-nél az onMouseOut event. Nem az van, hogy while onMouseOver (tehát amíg fölötte van).

Ha félreértelek, írd le, hogy szerinted hogyan van, mert a hozzászólásaidból (nekem) az jött le, hogy szerinted ott van a gond, hogy azért tűnik el, mert elviszi az input fölül az egeret.

"vagy magan a ddd-n egy masik elem fole erkezik az eger, ami triggereli a ddd onmouseout-jat."
Elso hozzaszolasombol ideztem. Magyarazzam el? A ddd az a menu (div), ami megjelenik, ha az input folott van az eger... az eger nyilvan ramaszik a ddd-re. Az onmouseout akkor triggerelodik, amikor a ddd-rol lemaszik a kurzor. Mivel ameg athuzod az input-rol a ddd-re, addig nem volt a ddd-n, igy a ddd onmouseout-ja nem is futhat le. Viszont ha a ddd-n van egy elem, teszem azt egy link, amint arra a linkre ralep a kurzor, es elotte a ddd-n volt, ezaltal a ddd-rol lelep, azaz lefut az onmouseout. Igy mar vilagos?

Mea culpa, én nem vettem észre, amikor kipróbáltam.

(Ha padding körbe be van akkorára állítva, mint maga a div, akkor működik rendesen, viszont ez már durván gányolás.)

Amúgy én is valami pure css megoldást ajánlanék. Vagy talán még azt sem, nem túl szerencsés az érintős kütyük korában az ilyen dropdown menu.