[HTML] Dropdown-Menu und Frames

_jo_ · 6. März 2008

hallo,
ich möchte auf meiner webseite am oberen rand eine (horizontale) dropdown-menu leiste einrichten. das geht mit dem freewaretool 'Visual QuickMenu' von OpenCube, auch für mich (der von html ein wenig ahnung hat, von javascript und php gar keine) recht einfach.
nun will ich die im dropdown-menu ausgewählten links im selben fenster anzeigen. den bildschirm wollte ich mittels frames in verschiedene bereiche aufteilen. theoretisch geht das, nur wird das dropdown-menu jetzt durch das mainframe begrenzt/abgeschnitten (siehe bild).
wahrscheinlich ist das nicht der richtige weg...? gibt es befehle, die es dem dropdown-menu erlauben über die frame-grenze zu gehen? oder ist die aufteilung mittels frames hier generell falsch? aber, wie macht man das sonst?

gruß

Odysseus64 · 6. März 2008

Also Frames werden heutzutage kaum noch verwendet. Hast du schon mal über CSS nachgedacht?

soomon · 6. März 2008

css/js/iframe/ajax

Backslash · 6. März 2008

Erstmal: Frames werden das Menü immer abschneiden.
Daraus folgt, dass wohl ein anderer Ansatz nötig wäre. Zum Beispiel das ganze in <div> Container packen, per CSS formatieren und die entsprechenden Inhalte per PHP inkludieren. So schwer ist das garnicht.
Zum Beispiel (einfach gehalten):
index.php:

PHP:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Beispielseite</title>
  <link rel="stylesheet" type="text/css" href="style.css" />
 </head>
 <body>
  <div id="topmenu">
   <!-- Das Menü, hier als Beispiel nur Links... -->
   <br />
   <a href="index.php?page=main">Home</a>
   <a href="index.php?page=bilder">Bilder</a>
   <a href="index.php?page=links">Links</a>
  </div>
  <div id="content">
   <?php
    $seite = "./".$_GET['page'].".php";
    if (!file_exists($seite))
	 $seite = "./main.php";
    include($seite);
   ?>
  </div>
 </body>
</html>

style.css:

Code:

div
{
	font-family:Arial,sans-serif;
	margin:0;
	text-align:center;
}

#topmenu
{
	height:80px;
	background-color:#EE2200; /* ein rot */
}

#content
{
	background-color:#22EE22; /* ein grün */
}

und in den Dateien main.php, bilder.php und links.php die entsprechenden Inhalte. (Das ganze sieht dann so aus.)

Ich rate dir dich damit zu beschäftigen, denn wie du merkst stößt du mit Fertigseiten und WYSIWYG schnell an deine Grenzen.
Eine gute Quelle wäre wie immer selfHTML
mfg

Crizzo · 6. März 2008

_jo_ schrieb:
hallo,
ich möchte auf meiner webseite am oberen rand eine (horizontale) dropdown-menu leiste einrichten. das geht mit dem freewaretool 'Visual QuickMenu' von OpenCube, auch für mich (der von html ein wenig ahnung hat, von javascript und php gar keine) recht einfach.
nun will ich die im dropdown-menu ausgewählten links im selben fenster anzeigen. den bildschirm wollte ich mittels frames in verschiedene bereiche aufteilen. theoretisch geht das, nur wird das dropdown-menu jetzt durch das mainframe begrenzt/abgeschnitten (siehe bild).
wahrscheinlich ist das nicht der richtige weg...? gibt es befehle, die es dem dropdown-menu erlauben über die frame-grenze zu gehen? oder ist die aufteilung mittels frames hier generell falsch? aber, wie macht man das sonst?

gruß

Frames sind generell veraltet und sollten in keiner neuerstellen Website mehr existieren, also weg damit.
Alle Links werden im selben Fenster angezeigt, wenn man ihnen es nicht explizit anders vorschreibt, was ich persönlich nie machen würde, der Benutzer soll entscheiden, ob der Link ein neues Fenster/Tab öffnet oder nicht.

Hier: http://xhtmlforum.de/40267-faq-h-ufig-gestellte-fragen-und.html unter Punkt 8 findest du nützliche Hilfe für "Dropdown"-Menüs, die sogar ohne JavaScript auskommen und trotzdem mit alten Internet Explorer funktionieren.

_jo_ · 6. März 2008

hallo,
vielen dank für die schnellen und informativen antworten.
von css habe ich (bis jetzt) auch 0 ahnung, so einfach siehts auf den ersten blick für mich auch nicht aus

hier http://www.cssplay.co.uk/ gibts auch viele schöne beispiele, aber mit copy/paste/edit (unter beachtung des copyright

) komme ich da nicht weit.

Crizzo · 6. März 2008

Wieso kommst du da nicht weit?

CSS-Grundlagen: http://www.thestyleworks.de/basics/index.shtml

_jo_ · 6. März 2008

Black.Hawk schrieb:
Wieso kommst du da nicht weit?

tja, weil ich wohl doch noch weniger ahnung habe als ich dachte

ich machs mal konkret:
habe mir den html-code dieses menus gespeichert und will das mit einem html-editor ändern. als verlinkung steht im menu bei einem element bspw

HTML:

<li><a href="#nogo">Third level-1</a></li>

was muss ich hier u.a. als url eintragen, wenn ich will, dass die linkseite im gleichen fenster (unter dem menu) angezeigt wird? ich hoffe du verstehst was ich meine.

Crizzo · 6. März 2008

Statt

Code:

href="#nogo"

einfach die Datei, die du öffnen willst z.B.:

Code:

<a href="links.html">Links</a>

_jo_ · 6. März 2008

Black.Hawk schrieb:
Statt

Code:

href="#nogo"

einfach die Datei, die du öffnen willst z.B.:

Code:

<a href="links.html">Links</a>

schon klar, aber bei mir klappt das nicht. wenn ich den link einfach so setze, wird die verlinkte seite geladen und die menu-seite verschwindet. auch wenn ich den zusatz

HTML:

target="main"

hinter den link schreibe klappt das nicht, es wird statt dessen ein neuer tab geöffnet, wie bei

HTML:

target="blank"

...?
da muss bestimmt noch ein css-befehl geändert werden.

nochmal kurz was ich eigentlich will:
ich will ein dropdown-menu oben 'festklemmen' und die links daraus immer in dem selben fenster (unter dem menu) öffnen.

Backslash · 6. März 2008

Deshalb mein Vorschlag.

Crizzo · 6. März 2008

_jo_ schrieb:
nochmal kurz was ich eigentlich will:
ich will ein dropdown-menu oben 'festklemmen' und die links daraus immer in dem selben fenster (unter dem menu) öffnen.

Du denkst noch in Frames! Vergiss die Frames, sie haben keine Vorteile!

Du öffnest mit einem Link ein andere Seite, diese Seite muss auch deine Navigation und alles andere, was sich nie verändert enthalten!

Wenn du jetzt nicht in jeder deiner, sagen wir 12 HTML-Dateien den Code der Navigation kopieren willst bzw. alle 12 ändern willst, wenn du sie mal anders machen willst, dann bleibt dir noch PHP.
Mit einem einfachen Befehl:

PHP:

<?php include("navi.html");?>

kannst du die Navigation zentral einlesen.
Dazu musst du nur obige Zeilen in deine 12 HTML-Dateien kopieren und eine navi.html erstellen, die nur den Code der Navigation enthält.

@Backslash: Ich glaube für deine Methode ist er noch nicht "reif".

Backslash · 6. März 2008

Ich bin aber der Meinung, wenn man wirklich Websites erstellen will, sollte man sich auch damit beschäftigen, denn wie schon gesagt, man stößt sonst eben irgendwann an Grenzen.
Und mein Beispiel ist da denke ich einfach genug gehalten dass man es versteht, wenn man sich ein wenig einarbeitet. Und dann ist man gleich ein ganzes Stück weiter und es öffnen sich ganz neue Möglichkeiten. Klar, man kann auch ewig nur Copy and Paste betreiben, aber man kommt nicht weiter und kann nie wirklich das umsetzen was man eigentlich will.
Deshalb empfehle ich jedem sich damit einmal eingehend auseinanderzusetzen, danach macht es auch viel mehr Spaß

Crizzo · 6. März 2008

Dann gib ihm doch lieber ein paar Tuts, die diese Variante erläutern bzw. helfen sie zu verstehen.

Backslash · 6. März 2008

Ich dachte er ist in der Lage den Sticky-Thread "Nützliche Links für Programmier-Anfänger" zu finden

Crizzo · 6. März 2008

So ist das also, na dann:

Mr. Snoot · 6. März 2008

Der Smiley geht nicht, wenn davor kein anderes Zeichen steht

(https://www.computerbase.de/forum/threads/d-smiley-kaputt.347534/)

sorry für OT

_jo_ · 7. März 2008

Black.Hawk schrieb:
Du denkst noch in Frames!

ja, ich gestehe

Backslash schrieb:
Ich dachte er ist in der Lage den Sticky-Thread "Nützliche Links für Programmier-Anfänger" zu finden

ist er

aber ich dachte ich kann ohne mich groß in css oder php einzuarbeiten mit einem 'html-trick' loslegen - klappt wohl nicht
jedenfalls vielen dank für eure posts

Backslash · 7. März 2008

Dabei nicht vergessen, dass der Sinn von HTML nie das Layout ist, sondern nur den Inhalt zu gliedern (in Überschriften, Texte etc.). Genau deshalb sollte man zum Beispiel auch keine Tabellen und frames fürs Design nutzen, sondern immer schöne Container die per CSS formatiert werden.
Das hat auch den Vorteil, dass spätere Änderungen wesentlich einfacher sind, da nur die CSS-Datei geändert werden muss.

_jo_ · 17. März 2008

hi,
eine frage habe ich noch immer:
ich nutze picasa von google als mein fotoalbumserver und -viewer (mag sein, dass es bessere gibt, aber ich bin damit momentan zufrieden).
nun will ich, dass mein dropdown-menu immer oben als leiste stehen bleibt und darunter die bilder des jeweiligen albums angezeigt werden (die verschiedenen alben sollen über mein menu auswählbar sein). da ich auf die (google-)webseiten der einzelnen alben keinen direkten zugriff habe, kann ich dort meinen menu-php-code nicht einbinden.
gibt es dafür eine lösung, oder nur die seine bilder mit eigener album-software online zu stellen?

danke.

[HTML] Dropdown-Menu und Frames

Cadet 4th Year

Anhänge

Cadet 1st Year

Lieutenant

Captain

Redakteur

Cadet 4th Year

Redakteur

Cadet 4th Year

Redakteur

Cadet 4th Year

Captain

Redakteur

Captain

Redakteur

Captain

Redakteur

Mr. Snoot

Gast

Cadet 4th Year

Captain

Cadet 4th Year

Ähnliche Themen