SEO-Software von Suchmaschinenoptimierung.de

DHTML-Navigation

(hier klicken, um zum Original Thread zu gelangen)
Ali
Hiiii,

ich hab da ein Problem.

Horizontale Navigation oben auf der Seite.
Sie befindet sich innerhalb einer Tabelle. Diese Tabelle ist mit center angeordnet, passt sich als dem Browserfenster an.
Nun möchte ich, wenn man Mouseover bei einem Link macht, ein Untermenü direkt unter dem Link erscheint.
Problem: Dieses Untermenü in Form einer weiteren Tabelle muss ja abhängig von der Größe des Browserfensters und damit abhängig von der Position des Linkes immer eine andere Position haben.

WIE krieg ich es also hin, dass dieses Untermenü immer an der richtigen Stelle erscheint?

Problem verstanden?

SOnst gerne nachfragen...

Grüßle
TroX
CSS: position: absolute; left: x; top: y;

finden der elementposition: http://www.quirksmode.org/js/findpos.html
Ali
Cool, wusste nicht dass es möglich ist die Position von Elementen herauszufinden.
Dann dürfte mir das reichen, wenn nich meld ich mich nomal.
Danke für die fixe Antwort :-)
Ali
Soo, ich habs jetzt soweit hinbekommen, dass das Ding halbwegs im IE läuft.
Nur Firefox macht mir Probleme, der zeigt mir die Submenüs nicht an.
Als Vorlage hab ich ein etwas älteres Menü genommen, kann sein dass das nicht ganz an die aktuellen Browser angepasst ist.
Hier der wichtigste Codeausschnitt:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
switch(i)
 {
  case 1:
   {
    if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
     {
      window.document.m1.visibility="show";
      window.document.m2.visibility="hide";
     return;
     }
    if (navigator.appVersion.charAt (0)<'5')
    {
    var layers=document.all.tags ("div");
    }
    else {
    var layers=document.getElementsByTagName("div");
    }
    layers[1].style.left=positionen[0];
    layers[1].style.top=positionen[1]+15;
    layers[1].style.visibility='visible';
    layers[3].style.visibility='hidden';
    return;
   }


Die Programmierung ist meiner Meinung nach ziemlich Kacke, bin aber au zu lange ausm Geschät draußen um das richtig beurteilen zu können.
Was muss ich denn ändern, dass der Spaß nun au bei Opera und Firefox läuft, weißt das wer?

Grüßle
TroX
Das CSS-Attribut visibility erwartet entweder den wert visible, hidden, collapse oder inherit.
Ali
Hm, hat leider nichts gebracht.
Unter welche der if-Abfragen, wo der Brwoser herausgefunden werde soll, fällt denn FireFox bzw Opera?
Ich könnt mir vorstellen, dass diese Aufgrund der if-Abfragen in die Kategorie IE gesteckt werden, da ja hier nur nach Netscape und IE unterschieden wird und somit die Elemente nicht darauf reagieren?!

Daher also die Frage, wie man in Opera und FF die jeweiligen Elemente anspricht?
TroX
document.getElementById( id )
Ali
so, das Problem liegt darin, dass im FF die Funktion erst gar nicht aufgerufen wird, kein Wunder dass das Menü dann nicht erscheint.

Nun also die Frage,warum eine simple mouseover-funktion m FF niht funktioniert, kannst mri da au helfen?

code:
1:
2:
3:
4:
5:
6:
<td width="104" class="mein_menu" onmouseover="this.style.cursor='hand'" onmouseout="this.style.cursor='default'">
<div onmouseover="menu(1,h1)" onmouseout="pruef('m1',1)" id="h1" style="visibility:visible">
 Über Uns
</div>


Die Funktion "menu(1,h1)" wird nur im IE, nicht aber im FF ausgeführt, why?
TroX
... menu(1,h1) ...


Der 2. Parameter muss als String übergeben werden.
Ali
Dacht ich au, aber ergibt n Fehler beim IE.
Habs jetzt nochmal geändert, probier jetzt glei noch was, wenn nich meld ich mich wieder. SON SCHEIß man

Edit: ok, ist nun gelöst, aber frag mich ned warum...diese scheiß browser inkompatibilität hät mich fast zum selbstmord getrieben.

eine kleine sache noch, was im FF ned funzt:

code:
1:
<td onmouseover="document.getElementById('zelle').style.cursor='hand'"></td>

bzw

code:
1:
<td onmouseover="this.style.cursor='hand'"></td>


funzt nur im IE, an was liegt das schon wieder?!
TroX
Na weil es keinen 'hand'-cursor gibt.
Der nennt sich 'pointer'
Ali
Ja unglaublich. Dank dir für die Mühe :-)
derletztekick
Hi,

naja, "hand" kennt der IE < 7. Mit pointer kann er nichts anfangen. Er bricht das Script afaik an dieser Stelle sogar ab.

Ich nutze daher:
code:
1:
try { th.style.cursor = "pointer"; } catch(e){ th.style.cursor = "hand"; }


Gruß Micha
(hier klicken, um zum Original Thread zu gelangen)



Tipp: Ranking-Konzept.de - Das SEO-Forum (Forum rund um die Suchmaschinenoptimierung) der artaxo AG.
Das große Versicherungs ABC von Versicherung.de - mit allen Aspekten der Computerversicherungen!
Fan-Foren.de, die große Community mit Musikforum ist ab sofort online.