✔ Menü-Problem auf einer Framesite

Status
Nicht offen für weitere Antworten.
F

Frank Snake

Grünschnabel
Hi

schaut euch erstmal den Entwurf meines Menüs an um folgendes besser zu verstehen. ;)

http://www.ff-bleidenstadt.de/ffbneu/index2.html

Ich möchte das sich das Untermenü erst öffnet wenn man auf den Button Einsätze klickt. Ich weiß allerdings nicht so recht wie ich das bewerkstelligen soll. Schön wäre es auch wenn der Button 2005 auch orange hinterlegt ist wenn ich jetzt auf der Seite für die Einsätze des Jahres 2005 bin. Wisst ihr wie man das am einfachsten machen kann? Ich komm da nämlich nicht weiter.

HTML: 
<table class="menul">
					<tr>
						<td class="down"><a href="#" onClick="show('einsatz')">Eins&auml;tze</a></td>
					</tr>
					<!-- Submenu -->
					<tr>
						<td>
							<table class="submenul" id="einsatz">
								<tr>
									<td><a target="Main" href="../2005/index2005.php">2005</a></td>
								</tr>
								<tr>
									<td><a target="Main" href="../2004.php">2004</a></td>
								</tr>
								<tr>
									<td><a target="Main" href="../2003.php">2003</a></td>
								</tr>
								<tr>
									<td><a target="Main" href="../2002.php">2002</a></td>
								</tr>
								<tr>
									<td><a target="Main" href="../2001.php">2001</a></td>
								</tr>
							</table>
						</td>
					</tr>
					<tr>
						<td><a target="Main" href="../einsatzabteilung.php">Einsatzabteilung</a></td>
					</tr>
					<tr>
						<td><a target="Main" href="../construct.php">Jugendfeuerwehr</a></td>
					</tr>
					<tr>
						<td><a target="Main" href="../uebungen.php">Fahrzeuge</a></td>
					</tr>
					<tr>
						<td><a target="Main" href="../40JFW.php">Brandschutz</a></td>
					</tr>
					<tr>
						<td><a target="Main" href="../uebungen.php">&Uuml;bungen</a></td>
					</tr>
					<tr>
						<td><a target="Main" href="../mwerbung.php">We want YOU!</a></td>
					</tr>
					<tr>
						<td><a target="Main" href="../links.php">Links</a></td>
					</tr>
				</table>
 
Hallo,

also wenn ichs richtig verstanden habe, soll der Button nach der Aktivierung eine
andere Farbe eingenommen haben. Eine Möglichkeit ist das Ganze über CSS
eine andere Hintergrundfarbe (a:active) zu geben. Da spinnt aber Netscape und
Opera. Ich würde es über onmouseout (JavaScript) lösen, Bilderaustausch.
Die Farbe des Buttons verändern.


Klaus


<gruebel> ;-) </gruebel>
 
am besten du machst es so...

HTML: 
function show(divid) {
document.getElementById("menu0").style.display="none";
document.getElementById("menu1").style.display="none";
document.getElementById("menu2").style.display="none";
document.getElementById("menu3").style.display="none";
 
document.getElementById(divid).style.display="inline";
 
}

zur Erklärung, menu0 ist ein leeres Untermenü das für die Buttons ist die kein UM haben. Damit werden dann offene Menüs geschlossen wenn man auf so einen Button klick.

menu1 bis menX sind für dei jeweiligen UMs.
HTML: 
<a href="#" target="show" onClick="show('menu1'); ></a><br>
<div id="menu1" style="display:none">
 
<a href="#" target="show" > </a><br>
<a href="#" target="show" > </a><br>
<a href="#" target="show" > </a><br>
</div>

mit onClick wird dann das jeweilige UM aufgerufen, dabei wird als parameter menu1 oder was auch immer übergeben.

Dann folgt ein Div - Tag indem du dann die UM - Punkte aufführst. Ausser bei menu0 das bleibt leer.

Wichtig ist nur das du für jedes Menü ein
document.getElementById("menu1").style.display="none";
in die Funktion show() schreibst, mit eigener ID.

Achso das ganze ist ein Js script.

Einfach aber efektiv...
 
Also so ganz funktioniert das noch nicht. Wenn ich auf Einsätze klicke, öffnet der die Seite in nem neuen Fenster, aber von einem Sub-Menu ist nichts zu sehen.

Wo liegt der Fehler, ich kann keinen erkennen.

Danke im Vorraus

Frank

HTML: 
<html>
	<head>
		<title>links</title>
		<link rel="stylesheet" type="text/css" href="ffbstyles.css">
			<script language="javascript" type="text/javascript">	
			function show(divid) {
			document.getelementbyid("menu0").style.display="none";
			document.getelementbyid("menu1").style.display="none";
			document.getelementbyid("menu2").style.display="none";
			document.getelementbyid("menu3").style.display="none";
 
			document.getelementbyid(divid).style.display="inline";
 	
			}
			</script>
	</head>
	<body>	
	<div class="button1"><a href="#" target="show" onclick="show('menu1')";>eins&auml;tze</a></div>
		<div id="menu1" style="display:none">
		<div class="button2"><a href="../2005/index2005.php" target="show" >2005</a></div>
		<div class="button2"><a href="../2004.php" target="show" >2004</a></div>
		<div class="button2"><a href="../2003.php" target="show" >2003</a></div>
		<div class="button2"><a href="../2002.php" target="show" >2002</a></div>
		<div class="button2"><a href="../2001.php" target="show" >2001</a></div>
		</div>
	<div class="button1"><a href="../index.html" target="_blank">einsatzabteilung</a></div>
	<div class="button1"><a href="../index.html" target="_blank">jugendfeuerwehr</a></div>
	<div class="button1"><a href="../index.html" target="_blank">fahrzeuge</a></div>
	<div class="button1"><a href="../index.html" target="_blank">brandschutz</a></div>
	<div class="button1"><a href="../index.html" target="_blank">&uuml;bungsplan</a></div>
	<div class="button1"><a href="../index.html" target="_blank">we want you!</a></div>
	<div class="button1"><a href="../index.html" target="_blank">links</a></div>
	</body>
</html>
 
Sorry, aber etwas spät... weiss jetzt nicht ob du es schon gelöst hast, aber das öffnen der neuen Fenster ligt am target="_blank"

Code: 
<div class="button1"><a href="../index.html" target="_blank">einsatzabteilung</a></div>

das _blank einfach durch show ersetzten, dann sollte es klappen.
 
Danke

Aber es wurde auch ne neue Seite geöffnet beim Target show. Ich habe das jetzt etwas anders gelöst.

Für alle die wissen wollen wie.

Code: 
 <html>
	<head>
		<title>links</title>
		<link rel="stylesheet" type="text/css" href="./ffbstyles.css">
			<script type="text/javascript">
			<!--
			function show(divid) {
    		d=document;
    		d.getElementById(divid).style.display="inline";
			}
			function hide(divid) {
    		d=document;
    		d.getElementById(divid).style.display="none";
			}
			//-->
			</script>
	</head>
	<body>
	<table border="0" cellspacing="0" cellpadding="0" width="165" height="100%">

		<tr>
			<th bgcolor="#CC3333" height="50" class="linkueberschriften">Organisation</th>
			<td bgcolor="#FFCC00" width="18"></td>
		</tr>
		<tr>
			<td bgcolor="#CC3333" width="165" valign="top">
				<div class="button1"><a href="#" onclick="show('einsatz'), hide('fzg'), hide('bs')">Eins&auml;tze</a></div>

					<div id="einsatz" style="display:none">
						<div class="buttonl"><a href="../2005/index2005.php" target="Main">2005</a></div>
						<div class="buttonl"><a href="../2004.php" target="Main">2004</a></div>
						<div class="buttonl"><a href="../2003.php" target="Main">2003</a></div>
						<div class="buttonl"><a href="../2002.php" target="Main">2002</a></div>
						<div class="buttonl"><a href="../2001.php" target="Main">2001</a></div>

					</div>
				<div class="button1"><a href="../einsatzabteilung.php" target="Main"  onclick="hide('einsatz'), hide('fzg'), hide('bs')">Einsatzabteilung</a></div>
				<div class="button1"><a href="../construct.php" target="Main" onclick="hide('einsatz'), hide('fzg'), hide('bs')">Jugendfeuerwehr</a></div>
				<div class="button1"><a href="#" onclick="show('fzg'), hide('einsatz'), hide('bs')">Fahrzeuge</a></div>
					<div id="fzg" style="display:none">
						<div class="buttonl"><a href="../vehicles/lf8.php" target="Main">LF 8/6 G</a></div>
						<div class="buttonl"><a href="../vehicles/lf16.php" target="Main">LF 16 TS</a></div>

						<div class="buttonl"><a href="../vehicles/tlf16.php" target="Main">TLF 16/25</a></div>
						<div class="buttonl"><a href="../vehicles/mtf.php" target="Main">MTF</a></div>
						<div class="buttonl"><a href="../vehicles/ah.php" target="Main">Anh&auml;nger</a></div>
					</div>
				<div class="button1"><a href="../index.html" target="Main" onclick=" show('bs'), hide('einsatz'), hide('fzg')">Brandschutz</a></div>
					<div id="bs" style="display:none">

						<div class="buttonl"><a href="../construct.php" target="Main">Brandschutzerz.</a></div>
						<div class="buttonl"><a href="../feuerloescher/feuerloescher.php" target="Main">Feuerl&ouml;scher</a></div>
						<div class="buttonl"><a href="../rauchmelder/rauchmelder.php" target="Main">Rauchmelder</a></div>
						<div class="buttonl"><a href="../Notfallfax.php" target="Main">Notfallfax</a></div>
					</div>
				<div class="button1"><a href="../uebungen.php" target="Main" onclick="hide('einsatz'), hide('fzg'), hide('bs')">&Uuml;bungsplan</a></div>

				<div class="button1"><a href="../mitglieder.php" target="Main" onclick="hide('einsatz'), hide('fzg'), hide('bs')">We want YOU!</a></div>
				<div class="button1"><a href="../Disclaimer.html" target="Main" onclick="hide('einsatz'), hide('fzg'), hide('bs')">Links</a></div>
			</td>
			<td bgcolor="#FFCC00" width="18"></td>
		</tr>
	</table>	 
	</body>
</html>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück