Probleme mit Dropdown-Menü mit Layers

Status
Nicht offen für weitere Antworten.
D

Dommas

Erfahrenes Mitglied
Hallo Leute

Ich habe ein kleines Dropdown-Menü erstellt und dabei ist ein Problem aufgetreten. Hier funktioniert es bestens: Menü OK
Und hier klappt's nicht wie gewollt: Menü nicht OK

Wenn man über die Links fährt, erscheint zwar das jeweilige Submenü, aber es verschiebt den Content um ca. 15 Pixel nach unten! Dies war auch schon so, als die Layers relativ positioniert waren. Ich habe dann auf absolut umgestellt, weil ich dachte, es müsste so funktionieren. Jedoch wird der Content immer noch verschoben. Liegt das an den Tabellen?

Ich wäre für jeden Tipp dankbar, den Quelltext könnt ihr ohne Probleme einsehen.

Vielen Dank für eure Hilfe!

Thomas
 
Hallo Leute

Habe ich vielleicht meine Frage im falschen Forum gestellt oder weiss wirklich niemand Rat?
Hier ist noch der Quelltext der Datei, die funktioniert (siehe Link "Menu OK).

Code: 
<html>
<head>
<title>CSS Menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
function swap_content( span ) {
displayType = ( document.getElementById( span ).style.display == 'none' ) ? 'block' : 'none';
document.getElementById( span ).style.display = displayType;
}
//-->
</script>
</head>

<body>
<font face="Verdana" size="1">
<table width="800" style="background-color:#6699ff">
	<tr>
		<td width="100" style="font-size:12"><a href="#">Home</a> </td>
		<td width="100" style="font-size:12"><a href="#" onMouseover="swap_content('2'); return false;" onMouseout="swap_content('2'); return false;">Vorstand</a></td>
		<td width="100" style="font-size:12"><a href="#" onMouseover="swap_content('3'); return false;" onMouseout="swap_content('3'); return false;">TSCB</a></td>
		<td width="100" style="font-size:12"><a href="#">Events</a></td>
		<td width="100" style="font-size:12"><a href="#">Anmeldung</a></td>
		<td width="100" style="font-size:12"><a href="#">Dokumente</a></td>
		<td width="100" style="font-size:12"><a href="#">Links</a></td>
		<td width="100" style="font-size:12"><a href="#" onMouseover="swap_content('8'); return false;" onMouseout="swap_content('8'); return false;">Intern</a></td>
	</tr>
</table>


<span id="2" onMouseover="swap_content('2'); return false;" onMouseout="swap_content('2'); return false;" style="display: none"><br>
<div style="background-color: #FFCC33; padding: 5px; position: relative; left:100px; top: -15px; width: 90px;">
Vorstand<br>
SPIKO<br>
Andere Funktionen
</div>
</span>

<span id="3" onMouseover="swap_content('3'); return false;" onMouseout="swap_content('3'); return false;" style="display: none"><br>
<div style="background-color: #FFCC33; padding: 5px; position: relative; left:200px; top: -15px; width: 90px;">
Herren NLA<br>
Junioren<br>
Training
</div>
</span>

<span id="8" onMouseover="swap_content('8'); return false;" onMouseout="swap_content('8'); return false;" style="display: none"><br>
<div style="background-color: #FFCC33; padding: 5px; position: relative; left: 700px; top: -15px; width: 90px;">
Fotos<br>
Kontakt<br>
Gästebuch<br>
Members
</div>
</span>

</font>
</body>
</html>
 
Hi,

ich hab mir das ganze mal angesehen. Wäre aber zu viel es hier alles zu erklären.
Ich habe Dir das Dokument in den Anhang gepackt - den Quellcode an den entscheidenden
Stellen mit Kommentaren versehen (wirst Dich schon durcharbeiten).

Ciao
Quaese
 
Vielen Dank erst mal - aber kann es sein dass du den Anhang vergessen hast oder bin ich zu blöd um ihn zu finden? :p
 
Hmmmm ...

... ich werde wohl langsam alt ... an Deinen Augen liegt es zumindest nicht ;-)

Diesmal aber
Quaese
 
Vielen Dank! Ich habe das File gerade heruntergeladen und getestet - besser als du kann man es wohl gar nicht machen :p

So ist es perfekt, ich passe noch die Farben und Schriften an und fertig. Du hast mir sehr geholfen, nochmals vielen Dank.

Gruss Thomas
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück