# Layermenu -.-*



## Pipe (29. Dez 2006)

Moin jungs
ich bin neu hier und ein absoluter java grünschnabel :roll:  ich bastele gerade an einer hompage und wollte dort ein _layermenu_ integrieren das sich bei mousover nach unten erweitert vielleicht könnt ihr mir ein paar tipps z.B. programme, scripts... geben 
wär echt super nett von euch! 

mir schwebt da sowas wie auf dieser hompage vor -> Layermenu Beispiel <-
das wär optimal!

Schonmal *vielen dank* im voraus ich würde mich über viele antworten freuen!

_PS_: wenn ihr es leichter fändet oder eher gesagt so nett wärt mir das genauer zu erklären könnt ihr euch auch über ICQ (_262012609_) bei mir melden


----------



## unknown_member (1. Jan 2007)

Das Übliche: Die Falle des kleinen Wörtchens "Script".

[schild=1]Java ist nicht JavaScript!!![/schild]


_____
MfG, unknown_member


----------



## pipe (1. Jan 2007)

na gut wie gesagt bin der übelste noob ^^
heisst dann was? hier kann mir keiner helfen oder was?  :cry:


----------



## unknown_member (3. Jan 2007)

Du bist einfach im falschen Forum! Das hier ist ein Java-Forum. Was du suchst, ist ein Java-*Script*-Forum wie SelfHTML. Das ist genauso, wie wenn du in der Drogerie nach einem Mercedes fragst...



_____
MfG, unknown_member


----------



## unknown_member (3. Jan 2007)

KLICK!


----------



## mephi (3. Jan 2007)

Jetz mach ihn doch nicht so an.. und ließ mal in was für einem unterforum wir hier sind


----------



## unknown_member (4. Jan 2007)

ja, okeee! war n bisschen zu hart...  :?


----------



## dieta (4. Jan 2007)

Mal als Tip: sichtbar machen kannst du ein solches Menü z.B. so:

```
document.getElementById("menülayer").style.visibility = "hidden";
					document.getElementById("menülayer").style.visibility = "visible";
```

Mal ein Vorschlag:
Setzte erst mal per css "position" auf "absolute". dann kannst du (auch mit JavaScript, so wie bei der Sichtbarkeit) die Attribute left (x-koordinate der linken oberen Ecke) und top (y-Korrdinate der linken oberen Ecke) ändern. Dan ganze nun noch kombiniert mit einem kleinem Mouseover -- und fertig ist das Menü.


----------



## dieta (4. Jan 2007)

SO, hab' jetzt mal aus Langeweile ein Layermenü mit JavaScript und CSS geproggt:

```
<html>
	<head>
		<title>JavaScript-Menü 1.0</title>
		<link rel=stylesheet type="text/css" href="style_jsmenu.css">
	</head>
	
	<body>
		
		<script language="JavaScript">
		<!--
			
			document.getElementById("klappe1").style.left = document.getElementById("menu1").style.left;
			document.getElementById("klappe1").style.top = document.getElementById("menu1").style.top+document.getElementById("menu1").style.height;
			
			function showMenu(nummer)
			{
				document.getElementById("klappe"+nummer).style.visibility = "visible";
			}
			
			function hideMenu(nummer)
			{
				document.getElementById("klappe"+nummer).style.visibility = "hidden";
			}
			
		//-->
		</script>
		
		<table>
			<tr>
				<td width="20px"></td>
				<td>
					<div id="menu1" class="menu" onmouseover="javascript:showMenu(1)" onmouseout="javascript:hideMenu(1)">Das tolle 1. Men&</div>
					<div id="klappe1" class="menuklappe" onmouseover="javascript:showMenu(1)" onmouseout="javascript:hideMenu(1)">Die 1. Zeile der Klappe
Die 2. Zeile der Klappe
Und noch die 3. Zeile der Klappe
Und zu guter Letzt die 4. Zeile der Klappe blalblabla laaange zeile!</div>
				</td>
				<td></td>
				<td>
					<div id="menu2" class="menu" onmouseover="javascript:showMenu(2)" onmouseout="javascript:hideMenu(2)">Men& 2</div>
					<div id="klappe2" class="menuklappe" onmouseover="javascript:showMenu(2)" onmouseout="javascript:hideMenu(2)">Zeile 1
Zeile 2
Zeile 3
Zeile 4
Zeile 5
Zeile 6
Zeile 7
Zeile 8</div>
				</td>
				<td></td>
				<td>
					<div id="menu3" class="menu" onmouseover="javascript:showMenu(3)" onmouseout="javascript:hideMenu(3)">Men& 3</div>
					<div id="klappe3" class="menuklappe" onmouseover="javascript:showMenu(3)" onmouseout="javascript:hideMenu(3)">Zeile 1
Zeile 2
Zeile 3</div>
				</td>
				<td></td>
				<td>
					<div id="menu4" class="menu" onmouseover="javascript:showMenu(4)" onmouseout="javascript:hideMenu(4)">Men& 4</div>
					<div id="klappe4" class="menuklappe" onmouseover="javascript:showMenu(4)" onmouseout="javascript:hideMenu(4)">Zeile 1
Zeile 2</div>
				</td>
				<td></td>
			</tr>
		</table>
	</body>
</html>
```

Und die dazu gehörige .css:

```
body { background: #FFFFFF; font-family: "Arial"; color: #22AA22 }

a:link { text-decoration: underline; color: #22AA22 }
a:active { text-decoration: none; color: #22AA22 }
a:hover { text-decoration: overline; color: #22AA22 }
a:visited { text-decoration: line-through; color: #22AA22 }
a:visited:active { text-decoration: none; color: #22AA22 }
a:visited:hover { text-decoration: overline; color: #22AA22 }

div.menu { background: #80F065; color: F6FFF6; display: inline; padding: 5px }
div.menuklappe { position: absolute; background: #80F065; color: F6FFF6; visibility: hidden; padding-top: 5px; padding-left: 10px; padding-bottom: 10px; padding-right: 10px }
```


----------



## pipe (9. Jan 2007)

achso ^^ wie gesagt ich hab kein schimmer von java und wusste auch nich das es zwischen java und javascript son großen unterschied gibt  :autsch: trotzdem großes dankeschön für eure bemühungen werde eure tipps mal checken! :applaus:


----------

