Mouseover klappt nicht wie gewünscht
orchid
- css
Hallo alle zusammen.
Vorneweg: Ich bin Anfänger.
Ich habe eine Navigationsleiste im linken Frame Bereich. Hierfür möchte ich für jeden Link(an der Zahl 10)einen Mouseover Effect realisieren. Die entsprechenden Grafken habe ich schon. Es sind die selben, die ich für die Links verwendet habe, nur in einer anderen Farbe. Die Grafiken sind auch schon entsprechend beschriftet.
Wie soll ich nun das Problem beschreiben?
Es erscheint plötzlich eine doppelte Linkgrafik neben dem Hauptlink. Wenn ich über den Hauptlink "hovere" wechselt die grafik in dem duplizierten Link rechts daneben. Die Hover Grafik soll aber unter dem Hauptlink liegen.
Ich hoffe ihr versteht was ich meine.
Hier mein Codeauszug:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Navigation</title>
</head>
<body bgcolor="#172262">
<p style= "margin-top: 1cm"></p>
<a href="Willkommen.htm" target="Hauptfenster"
onmouseover="document.NAME.src='button1.png'"
onmouseout ="document.NAME.src='orange1.png'"><img src="orange1.png" border="0" alt="bild.jpg"><img name=NAME src='orange1.png'></a>
<p></p>
<a href="Ueber%20uns.htm" target="Hauptfenster"><img src="orange2.png" border="0" alt="bild.jpg"></a>
<p></p>
<a href="Unser%20Haus.htm" target="Hauptfenster"><img src="orange3.png" border="0" alt="bild.jpg"></a>
<p></p>
<a href="Anfahrt.htm" target="Hauptfenster"><img src="orange4.png" border="0" alt="bild.jpg"></a>
<p></p>
<a href= Aktuelles.htm target="Hauptfenster"><img src="orange5.png" border="0" alt="bild.jpg"></a>
usw.
</body>
</html>
Und wie bekomme ich das Ganze für alle 10 Links gelöst, deren Bilder ja alle verschiedene Dateinamen haben?
Sollten noch Verständnis Probleme aufgrund meiner Schilderung sein, bitte ich um konkrete Fragen.
Danke schon mal.
Liebe(r) orchid,
kannst Du mir den strukturellen Sinn dieses Codes erklären?
<p></p>
<a href="Ueber%20uns.htm" target="Hauptfenster"><img src="orange2.png" border="0" alt="bild.jpg"></a>
<p></p>
<a href="Unser%20Haus.htm" target="Hauptfenster"><img src="orange3.png" border="0" alt="bild.jpg"></a>
<p></p>
<a href="Anfahrt.htm" target="Hauptfenster"><img src="orange4.png" border="0" alt="bild.jpg"></a>
<p></p>
<a href= Aktuelles.htm target="Hauptfenster"><img src="orange5.png" border="0" alt="bild.jpg"></a>
usw.
[/code]
Mich wundert, dass der Browser mit diesem Code nicht noch größeren Unfug anfängt.
Wie man eine Navigation richtig macht, steht in SELFHTML: http://de.selfhtml.org/css/layouts/navigationsleisten.htm
Liebe Grüße,
Felix Riesterer.
Zitat:
Liebe(r) orchid, kannst Du mir den strukturellen Sinn dieses Codes erklären?
Lieber Felix Riesterer.
Das ist die Navigationsdatei auf die sich die gesonderte Frame Datei bezieht.
In dieser Navigationsdatei sind alle Linkbuttons aufgeführt, welche in dem Frame geladen werden sollen, der in der Framedatei bestimmt ist. Wenn ich also die Frame Datei öffne, wird im linken Teil meine Navigationsleiste dargestellt, mit allen 10 Links, schön untereinander.
Hi,
In dieser Navigationsdatei sind alle Linkbuttons aufgeführt, welche in dem Frame geladen werden sollen, der in der Framedatei bestimmt ist. Wenn ich also die Frame Datei öffne, wird im linken Teil meine Navigationsleiste dargestellt, mit allen 10 Links, schön untereinander.
Das mag den angedachten Zweck erklären - den strukturellen Sinn, nach dem gefragt wurde, aber noch lange nicht.
Beispielsweise das halbe Dutzend leerer Textabsätze, die du offenbar nur einfügst, im Abstände zu erzeugen - die sind absoluter Humbug.
Zeichne das ganze vernünftig aus (als Liste von Links, also UL>LI>A), und formatiere es anschliessend mittels CSS wie gewünscht.
Derzeit kann der von dir gewählte Themenbereich „CSS” eigentlich nur ein Versehen oder blanker Hohn gewesen sein.
MfG ChrisB
O.K. Danke für den Hinweis.
Offensichtlich war meine Vorgehensweise für diesen Zweck völlig daneben.
Bin allerdings nur nach einer Anweisung aus einem Buch nachgegangen.
Ich werde das Ganze nach eurem Vorschlag noch einmal völlig neu umstrukturieren. Und dann mal schauen, ob es besser klappt.
Und ja, die Auswahl Rubrik war ein Versehen.
Ja, das stimmt. Die p Tags sollten als Absatzmarke dienen. Wie könnte ich denn Absätze zwischen den Links realisieren?
Grüße Orchid
Wie könnte ich denn Absätze zwischen den Links realisieren?
Deine Frage sollte lauten, wie formatiere ich Links so, dass sie zueinander einen Abstand haben.
Lerne CSS, die Formatiersprache für HTML.
Besonders:
http://de.selfhtml.org/css/eigenschaften/positionierung.htm
http://de.selfhtml.org/css/eigenschaften/randabstand.htm
und als Grundlage:
http://de.selfhtml.org/css/formate/einbinden.htm
mfg Beat