Div-Layer flackert - nur im IE :-\

[Melanie]

Hallo!

Ich arbeite zur Zeit an einer Seite, die eine horizontale Kartei-reiter-Navigation enthält. Der User rollt über einen Punkt, darunter erscheint dann ein Layer mit weiteren Unterpunkten. Klappte soweit wunderbar. Nun war es so, dass allerdings die Unterpunkte immer dann stehen blieben, wenn der User die Navigation nach oben bzw. links und rechts verliess.
Ich dachte mir folgendes: Mausposition auslesen (die Navigation genau wie die Unterpunkt-Navi ist im Div absolut positioniert, damit lässt sich ja gut weiterarbeiten) und dann wenn maus_x kleiner bzw. größer als ein bestimmter wert ist --> layer mit Unterpunkten wieder ausblenden. Das Gleiche mit y für oben.
Folgendes Skript tut genau das (hab ich im Netz gefunden und adaptiert):

// find out if ie runs in quirks mode
var docEl = (
typeof document.compatMode != "undefined" &&
document.compatMode != "BackCompat"
)? "documentElement" : "body";

// register event
// capture it for nc 4x (ok it's a dino)
function init_mousemove() {
if(document.layers) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = dpl_mouse_pos;
}

function dpl_mouse_pos(e) {
// position where mousemove fired
var xPos = e? e.pageX : window.event.x;
var yPos = e? e.pageY : window.event.y;
// for ie add scroll position
if (document.all && !document.captureEvents) {
xPos += document[docEl].scrollTop;
yPos += document[docEl].scrollTop;
}
// display position
//document.feld.ausg.value = "Left = " + xPos + " : Top = " + yPos;
if (xPos<190){
MM_showHideLayers('geld_konto','','hide');
};
if (xPos>670){
MM_showHideLayers('sparen','','hide');
};
if (yPos<80){
MM_showHideLayers('vorsorge','','hide'); MM_showHideLayers('ratgeber','','hide');MM_showHideLayers('sparen','','hide');MM_showHideLayers('gel d_konto','','hide');
};
// for the dino pass event
if (document.layers) routeEvent(e);
}

Dieses Skript wird onload aufgerufen.
Ansich nicht schlecht, funktioniert im Prinzip auch im IE, Firefox, Netscape und Opera. ABER: In allen ausser IE bleibt das Layer mit den Unterpunkten ruhig stehen, der User kann wählen, super! Im IE allerdings flackert das div, wenn man mit der Maus drüberfährt, so als ob es sich immerzu neu lädt (was es natürlich nicht soll). Ich habe schon herausgefunden, dass es an diesem und nur an diesem Skript liegt, aber wo dort und wie kann ich das Problem beheben? Und warum nur im IE (sch***-browser)?
Ich hoffe, ihr könnt mir helfen.

Vielen Dank schonmal im Voraus!
Melanie :-)

[Maxx]

Hallo,

Der User rollt über einen Punkt, darunter erscheint dann ein Layer mit weiteren Unterpunkten.

Wie ist das einblenden realisiert? Mit welchem javascript?

Klappte soweit wunderbar. Nun war es so, dass allerdings die Unterpunkte immer dann stehen blieben, wenn der User die Navigation nach oben bzw. links und rechts verliess.

Ist es nicht besser den Fehler da zu beheben wo er entsteht? Im Script welches die Navigation einblendet. "Nach unten" scheint es mit dem ausblenden ja zu funktionieren.

xPos += document[docEl].scrollTop;

Da "scrollTop" vermutlich 0 ist dürfte es egal sein. Ist aber trozdem falsch. xPos ist horizontal, scrollTop ist vertikal. scrollLeft passt besser.

Grüße,

Jochen

[Melanie]

Hallo Jochen,

das Einblenden funktioniert über folgende Skripte:

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() {
var i,p,v,obj,args=MM_showHideLayers.arguments;
   for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
  if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
  obj.visibility=v;
   }
}

Ja, nach unten hin funktioniert es auch, da ich die einblenden-funktion auch dort auf die Layer mit den Unterpunkten gelegt habe. Denn mit onmouseout auf den Hauptpunkten verschwand es anfangs auch, wenn ich die buttons nach unten hin verlassen hab.

xPos += document[docEl].scrollTop;

Da "scrollTop" vermutlich 0 ist dürfte es egal sein. Ist aber trozdem falsch. xPos ist horizontal, scrollTop ist vertikal. scrollLeft passt besser.

Das habe ich ausprobiert, bringt aber auch nicht den gewünschten Erfolg. :-(

Ich glaube schon, dass der Fehler nicht in dem einblend-skript entsteht, da ich bis gestern nur das hatte und es da funktionierte und seit ich es heute um die nach-oben und zur-seite-raus Funktionen erweitert habe, flackert es. Hast du noch eine Idee, woran es liegen könnte?

Danke im Voraus,
Melanie

[Ingo Turski]

Hi,

Du solltest ein solches Script nur für die Browser nutzen, die ein dynamisches CSS-Menü nicht darstellen können (also für den IE und ggfls. den NN4).
Schau' Dir mal meine dynamische Navigationsleiste an - die ist noch dazu sauber als Liste ausgezeichnet und setzt die Eventhandler auch erst über das Script ein.

freundliche Grüße
Ingo

[Melanie]

Hallo Ingo,
vielen Dank für deinen Tipp, ich werde mir dein Beispiel mal genau anschauen. Auf jeden Fall sieht es auch den ersten Blick sehr viel besser aus als mein Versuch :-)

Liebe Grüße,
Melanie