hi,
Der Ansatz ist schon richtig. In meiner Seite, die ich als Beispiel angeführt habe, mache ich es auch nicht anders.
Die Links haben eine Klasse, auf die wird mit CSS ein „Verhalten“ bei :hover definiert, ganz normal also.
Ich habe mich daran versucht, aber dass ist schon eine etwas kompliziertere Geschichte, wie in deinem Beispiel.
Ich schaffe es zwar, die Elemente zeitverzögert einzublenden, nur muss ich dann alle möglichen Elemente prüfen, ob die mouse over oder out ist.
Bsp.:
<button/> <!--
mouseover, zeige Element mit den Links
mouseout, verstecke Element wieder
-->
<p id="links">
<a/><a/><a/>
</p>
<!-- <button/> und <p> werden absolut positioniert, daher kann ich auf das
umgebende Element nicht zurück greifen -->
In diesem Fall muss ich ja auch immer wieder prüfen, wo die Maus ist, denn wenn ich sage,
button.onmouseover = function() {
setTimeout(function() {links.className = 'show';}, 600);
}
button.onmouseout = function() {
setTimeout(function() {links.className = 'hide';}, 200);
}
dann klappt die Box zu, sobald die Maus nicht mehr auf dem button ist.
Wie könnte ich dieses Problem lösen, oder angehen?
Mich nervt es nämlich sehr, daß ich bei vielen Web-Seiten tausend Popups oder Änderungen habe, wenn ich z.B. mit der Maus nur mal eben quer über die Seite zum Scrollbalken will oder ähnliches.
Dito, mir geht es nicht anders.
mfg