#1 6. Mai 2009 Drop Down Menu problem hallo zusammen. Hab mir mal nen animiertes dropdown menu gebastelt, funktioniert auch bis auf eine sache: Ich habe einen menupunkt, wenn dieser mit der maus überfahren wird fahren unterpunkte per animation aus. alles ist mit einem div ummantelt, die funktionen werden per onmouseout und onmouseover ausgeführt. wenn ich jetzt aber den menupunkt verlasse und löst das gleich die onmouseout funktion aus, obwohl sich die maus eigentlich noch im div befinden sollte. wenn ich schneller als die animation bin, und auf einen der unterpunkte gelange, geht das menu nicht zu, erst wenn ich von diesem wieder herunter gehe oder aber auch, wenn ich versuche einen anderen punkt im untermenupunkt auszuwählen. Bsp.: http://encud.kilu.de/navibsp/ hier der code: Html: HTML: <div class="haupt" onmouseout="up('design')" onmouseover="down('design')"> <p id="design_p"><a href="">Menupunkt</a></p> <div class="teil_abs"> <div class="teil_rel" id="design_drop_div"> <p><a href="">1. Unterpunkt</a> <a href="">2. Unterpunkt</a> <a href="">3. Unterpunkt</a></p> </div> </div> </div> JS: Code: x = -20; z = 0; zu = false; runtime = 30; function down(id) { document.getElementById(id + "_drop_div").style.display = "block"; if(x < 0 && zu == false) { x += 0.5; z += 0.05; document.getElementById(id + "_drop_div").style.top = x + "px"; document.getElementById(id + "_drop_div").style.opacity = z; } if(zu == false && x >= 0) { zu = true; document.getElementById(id + "_p").style.color = "#303"; } if(zu == false) window.setTimeout("down('" + id + "')",runtime); } function up(id) { if(x > -20 && zu == true) { x -= 0.5; z -= 0.05; document.getElementById(id + "_drop_div").style.top = x + "px"; document.getElementById(id + "_drop_div").style.opacity = z; } if(zu == true && x <= -20) { document.getElementById(id + "_drop_div").style.display = "none"; document.getElementById(id + "_p").style.color = "#909"; zu = false; } if(zu == true) window.setTimeout("up('" + id + "')",runtime); } css: Code: .haupt { float:left; } .header_menu_middle .teil_abs { position:absolute; } .header_menu_middle .teil_rel { position:relative; display:none; left:-60px; top:-20px; } hoffe mir kann wer von euch weiter helfen!! gruß encud + Multi-Zitat Zitieren
#2 6. Mai 2009 AW: Drop Down Menu problem sperr die funktion halt einfach^^ set bei onmouseover bei der funktion zb "var locked = true;" und guck dann bei onmouseout bei dem ding if(locked==true) { return false; } + Multi-Zitat Zitieren
#3 6. Mai 2009 AW: Drop Down Menu problem wenn ich das mache fann fährt die navi doch aber garnicht mehr ein?! das ja auch nicht ziel der übung xD hätte wenn dann eher an sowas wie eine reaktionszeit gedacht, aber da wüsste ich nicht wie das umzusetzten ist... + Multi-Zitat Zitieren
#4 8. Mai 2009 AW: Drop Down Menu problem if(noch nicht ganz ausgefahren) lock = true else // wenn navi ganz ausgefahren und der user solls wieder einfahren dürfen lock = false Oo + Multi-Zitat Zitieren
#5 8. Mai 2009 AW: Drop Down Menu problem hmm ich glaube du hast mein problem noch nicht ganz erfasst, weil auch wenn die navi ganz ausgefahren ist und ich dann nach unten auf die unterpunkte will, funktioniert es nicht... oder versteh ich dich vllt nicht?^^ hab mal ne datei hochgeladen damit das vllt besser verständlich ist http://encud.kilu.de/navibsp/ + Multi-Zitat Zitieren
#6 8. Mai 2009 AW: Drop Down Menu problem den onmouseout-event am besten im ausgeklappten menu definieren, dann sollte das klappen. + Multi-Zitat Zitieren
#7 8. Mai 2009 AW: Drop Down Menu problem wenn ich das mache, klappt es erstens nicht ein wenn ich mit der maus nach oben gehe und was noch dazu kommt, wenn ich mit der maus auf den text gehe fährt er trotzdem sofort wieder ein?! mir kommt das fast vor als ob ich anstatt onmouseout ein onmouseover-event hätte?! zum verrücktwerden hier xD edti: merke gerade das da anscheinend noch ein padding drin war, wenn dieser weg ist zwischen ober und untermenu dann fährt es zunächst nicht ein, wenn ich den unterpunkt aber wechseln will schon + Multi-Zitat Zitieren
#8 8. Mai 2009 AW: Drop Down Menu problem dann definier das ausklappmenu als child des handlers, dann feuert mouseout nur wenn du beide elemente verlässt. ich schreib dir da mal was + Multi-Zitat Zitieren
#9 9. Mai 2009 AW: Drop Down Menu problem wäre echt geil, weiß zwar was du mit dem child meinst aber hab kp wie man das macht... + Multi-Zitat Zitieren
#10 9. Mai 2009 AW: Drop Down Menu problem ne sorry, hab keine zeit dafür. hatte schon angefangen aber dann das selbe problem wie du: das <li>-element verliert den focus wenn das <ul>-element drüber fliegt => mouseout wird gefeuert. mit standard css funktioniert es aber ohne probleme, ohne den effekt auch. + Multi-Zitat Zitieren
#11 11. Mai 2009 AW: Drop Down Menu problem ok kein problem, rl geht natürlich vor^^ was meinst du mit standard css?! nur mit css bekomm ich doch dann aber keine animation hin oder etwa doch?!?! ich meine an sonsten wäre das sogar noch besser, css kann man so schlecht abstellen + Multi-Zitat Zitieren