Zum Inhalt springen

POPUP menü über ein anderes Frame laufen lassen


Empfohlene Beiträge

Geschrieben

Hallo

Ich hab folgendes Proplem: ich möchte ein Popup menü das im oberen frame ist in einem anderem frame anzeigen lassen !!

Erläuterung: Wenn ich mit der Maus über ein Wort "Hallo" darüberfahre dann fährt

das menü herunter. Diese menü soll aber nicht im selben frame herunter kommen

sondern im frame darunter.

Frage geht das ?

Wenn ja wie ?

Mfg Nok

Geschrieben

jo also ich hab genau das schon programmiert. ich kann dir aber leider nur ein paar kurze hinweise dazu geben...

das javascript sieht so aus:

--------parent.main.document.all.Layer1.style.visibility="visible";------

du befindest dich also im oberen frame, das frame indem deine navigation liegt heisst in diesem falle "main". dort ist ein div mit dem namen "layer1". das ereignis liegt meinetwegen auf dem <a onMouseOver()>hello</a>. dort rufst du dann eine funktion auf in der das JS s.o. liegt....

was du dann meistens noch benötigst ist ein onScrol() event im body deines "main" frames...sieht für den einen layer so aus:

das ist die function repos() :

-----document.all.Layer1.style.top = document.body.scrollTop;-------

<body onScroll="repos();">

und wird im <body> des "main" frames, also der html seite, gesetzt z.B.:

damit bleibt dann die navigation auch beim scrollen nach unten immer am oberen ende...

hoffe das reicht dir!

begbie

Geschrieben

Hi Begbie

Also ich hab es grad versuch mit deinem Script, blick aber nicht so ganz durch.

Was meinst du mit main ist das frame in dem die Navigation ist ?

Wo wird dann das frame angeben wo in welches frame es soll ???

NOK

Geschrieben

Probier das mal aus. Ich habe es gerade mal zusammengestrickt und mit dem IE, Konqueror und Phoenix ausprobiert. Hat alles geklappt. Die Funktion css(), genauso wie die beiden Aufrufe dieser Funktion sind für das Beispiel natürlich völlig irrelevant.

index.htm:

<html>

<frameset rows="30,*" framespacing=0 frameborder=0 border=0>

<frame src="oben.htm" name="oben" scrolling=no>

<frame src="about:blank" name="unten">

</frameset>

</html>

Was passiert hier also: Es wird ein Frameset aufgebaut, dessen Frames die Namen "oben" und "unten" tragen. Um nicht noch eine Datei erstellen zu müssen, wird in "unten" erst einmal gar nichts geladen (about:blank).

oben.htm:

<html>

<script>

var written=0;

function menutitle()

{

// Definition der Menütitel

menutitle = new Array("Menü 1","Menü 2","Menü 3");

// Ausgabe der Menütitel in den oberen Frame

for(i=0;i<menutitle.length;i++)

{

document.write("<div style='position:absolute;left:"+(50+i*100)+"px;top:14px;width:99px;background-color:#666666;text-align:center'><b><a href='Javascript:showmenu("+i+");'>"+menutitle+"</a></b></div>");

}

}

function showmenu(id)

{

if(written==0)

{

writemenu();

}

for(i=0;i<menu.length;i++)

{

parent.frames["unten"].document.getElementById("menu"+i).style.visibility="hidden";

}

parent.frames["unten"].document.getElementById("menu"+id).style.visibility="visible";

}

function writemenu()

{

// Definition der Menüeinträge und URLs

menu = new Array();

menu[0]=new Array("M1L1","M1L2","M1L3");

menu[1]=new Array("M2L1","M2L2","M2L3","M2L4");

menu[2]=new Array("M3L1","M3L2");

url = new Array();

url[0]=new Array("m1l1.htm","m1l2.htm","m1l3.htm");

url[1]=new Array("m2l1.htm","m2l2.htm","m2l3.htm","m2l4.htm");

url[2]=new Array("m3l1.htm","m3l2.htm");

// Ausgabe der Menüs in den unteren Frame

for(i=0;i<menu.length;i++)

{

parent.frames["unten"].document.write("<div id='menu"+i+"' style='position:absolute;padding-left:5px;left:"+(50+i*100)+"px;top:0px;width:99px;background-color:#888888;visibility:hidden;'>");

for(t=0;t<menu.length;t++)

{

parent.frames["unten"].document.write("<a href='"+url[t]+"'>"+menu[t]+"</a><br>");

}

parent.frames["unten"].document.write("</div>");

}

written=1;

}

function css(frame,bgcol)

{

// Ausgabe der StyleSheets

parent.frames[frame].document.write("<style>body{background-color:#000000;font-family:Arial,Helvetica;font-size:12px;margin:0px;}a{text-decoration:none;color:#cccccc;}a:hover{color:#ffffff;}</style>");

}

css("oben");

css("unten");

menutitle();

</script>

<body>

</body></html>

Die Datei oben.htm definiert als erstes die globale Variable "written", mit der geprüft wird, ob die Menüs im Frame "unten" bereits geschrieben worden sind. Anschließend wird die

JS-Funktion menutitle() gestartet, die im oberen Frame drei Links erzeugt. Nach einem Klick auf einen dieser Links wird die Funktion showmenu() aufgerufen, die zuerst die Variable "written"

abfragt. Da diese anfangs auf 0 (=>Menüs noch nicht geschrieben) gesetzt wurde, wird die Funktion writemenu() aufgerufen, die die Menüs in den Frame "unten" schreiben und mittels css verstecken. Anschließend wird "written" auf 1 (=>Menüs sind geschrieben) gesetzt, so daß beim nächsten Klick auf einen der Menüpunkte im Frame "oben" die Menüs nicht noch einmal geschrieben werden. Anschließend werden alle Menüs versteckt und nur das gewünschte Menü angezeigt.

Alle Links und Linkbezeichnungen stehen in den Arrays menutitle, menu und url. Wo liegen jetzt die Schwächen bei dieser Demo? Nun, wenn man einen Link in einem Menü anklickt, wird die entsprechende Seite aufgerufen. Dadurch verschwinden aber die in den Frame "unten" geschriebenen Menüs. Die Variable "written" steht aber immer noch auf 1. Demnach gibt es hinter keine Möglichkeit mehr, ein Menü aufzurufen.

Und warum habe ich das nicht gleich richtig gemacht, bevor ich das hier gepostet habe? Mal abgesehen davon, daß ich keine Lust mehr habe, mich weiter damit zu beschäftigen, liegt es doch auf der Hand, daß sich Deine Frage mit einem simplen parent.frames["unten"].document.write() hätte beantworten lassen. Außerdem würde man in der Realität ein solches Konstrukt sowieso nicht einsetzen.

Was kannst Du also tun? Die Funktion css() und deren aufrufe schmeißt Du raus und benutzt eine externe css-Datei, die man sowieso auf jeder Seite einbinden sollte. Falls Dir PHP (oder ähnliches) zur Verfügung steht, würde ich das, was die Funktion writemenu() tut einfach in eine eigene HTML-Datei schreiben und ebenfalls auf jeder Seite includieren. Dadurch kannst Du Dir den ganzen Murks mit "written" sparen, da die Menüs dann sowieso immer vorhanden sind. Sollte Dir PHP nicht zur Verfügung stehen, nimmst Du den Inhalt der writemenu()-Funktion, steckst ihn in eine externe js-Datei und fügst in jede Deiner Seiten <script src="writemenu.js"></script> ein. Dadurch erreichst Du das gleiche.

Was hast Du dann noch? Viele Seiten, die die StyleSheets anziehen und das versteckte Menü includieren (auf welche Art

auch immer) und einen oberen Frame, in dem die einzelnen Links die Funktion showmenu() aufrufen, die Du auch um die written-Abfrage kürzen kannst.

Viel Spaß damit.

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...