Layermenu -.-*

Status
Nicht offen für weitere Antworten.
P

Pipe

Gast
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

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

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


_____
MfG, unknown_member
 
P

pipe

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

unknown_member

Bekanntes Mitglied
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
 

mephi

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

dieta

Top Contributor
Mal als Tip: sichtbar machen kannst du ein solches Menü z.B. so:
Code:
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

Top Contributor
SO, hab' jetzt mal aus Langeweile ein Layermenü mit JavaScript und CSS geproggt:
Code:
<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:
Code:
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 }
 
P

pipe

Gast
 
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:
 
 
Status
Nicht offen für weitere Antworten.

Oben