Archivlink: javarea.de Forum > JavaScript > Foldoutmenu und php-links
Vollständigen Link anzeigen: javarea.de Forum > JavaScript > Foldoutmenu und php-links

Pages: [1]
geschrieben von mp3 am 16.05.2005 - 17:18
schon lange versuche ich ein "Klappmenue" zu erstellen.
Im Web gibt es unendlich viele Möglichkeiten, jedoch meistens mit Javascript..
Das Erstellen der Menues mit den diversen Progs ist kein Problem......
bis ich meine php-links einbinde. Danach werden die Menues nicht mehr angezeigt.
Heute habe ich bei Euch das Foldoutmenue entdeckt und habe die Hoffnung von
Euch den letzten Schliff(Tipp) für das Menue zu erhalten.
Ich habe die HTML-Datei als php-Datei abgespeichert, da ich das Menue in
einer php-Datei einbinden möchte.
Jedoch ist es mir auch hier nicht gelungen den Link (Menu1) korrekt
einzubinden.
Es wäre super wenn ich hier Hilfe oder einen Tipp bekommen könnte.
den Code der betreffenden Datei habe ich einfach mal angehängt:

<?php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Menu</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function montre(id) {
if (document.getElementById) {
document.getElementById(id).style.display="block";
} else if (document.all) {
document.all[id].style.display="block";
} else if (document.layers) {
document.layers[id].display="block";
} }

function cache(id) {
if (document.getElementById) {
document.getElementById(id).style.display="none";
} else if (document.all) {
document.all[id].style.display="none";
} else if (document.layers) {
document.layers[id].display="none";
} }

//-->
</script>
<style type="text/css">
<!--

body {margin: 10px; padding: 0; font: 14px Verdana, sans-serif;}

ul, li {
list-style-type: none;
margin: 0;
padding: 0;
}

div.menu {
position: absolute;
width: 600px;
top: 10px;
z-index: 3;
}
div.menu li {
float: left;
width: 120px;
}

div.menu a {
margin: 0 2px;
height: 20px;
display: block;
text-align: center;
font-weight: bold;
border: 1px solid gray;
text-decoration: none;
color: #000;
background: #fff;
}

div.menu a:hover {
background: #ccc;
border: 1px solid gray;
}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5 {
display: none;
float: left;
width: 120px;
font-size: 12px;
}
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a {
font-weight: normal;
border-top: 0 none;
}
.site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray;
}

.mentions {
position: absolute;
top : 300px;
left : 10px;
color: #000;
background-color: #ddd;
}
a {text-decoration: none;
color: #222;
}

-->
</style></head>


<body>

<div class="menu">
<ul><li><a onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" href="">Menu 1</a> <ul style="display: none;" id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="index.php?act=login&goon=login&goon2=profil&username=<?php echo"$username"; ?>&passwort=<?php echo"$usermenupasswd"; ?>"Profil</a></li>
<li><a href="">Subkategorie 1.2</a></li>
<li><a href="">Subkategorie 1.3</a></li>
</ul></li>
usw, usw....


Vielen Dank vorab

MP3

geschrieben von René am 16.05.2005 - 17:36
Probier mal?

PHP-Quelltext
1: 
2: 
3: 

<a href="index.php?act=login&goon=login&goon2=profil&username=<?php echo $username; ?>&passwort=<?php echo $usermenupasswd; ?>">Profil</a>


Wäre auch ok.

PHP-Quelltext
1: 
2: 
3: 

<a href="index.php?act=login&goon=login&goon2=profil&username=<?= $username; ?>&passwort=<?= $usermenupasswd; ?>">Profil</a>

geschrieben von mp3 am 17.05.2005 - 08:48
Danke Rene´,

hat mir sehr geholfen. Es funktioniert .

geschrieben von mp3 am 23.05.2005 - 19:19
Hallo,
nun stehe ich vor dem nächsten Frage.
Ich möchte das Menue nicht am oberen Rand der HP platzieren sondern unterhalb einer Grafik in einer Tabelle.
Wie muss ich vorgehen?

Viele Grüße

mp3

geschrieben von René am 23.05.2005 - 19:32
HTML-Quelltext
1: 
2: 
3: 
4: 
5: 
6: 

div.menu {
position: absolute;
width: 600px;
top: 10px;
z-index: 3;
}

geschrieben von mp3 am 26.05.2005 - 15:28
Danke, habs hinbekommen :-)

geschrieben von nujavadi am 27.05.2005 - 11:10

geschrieben von mp3 am 06.06.2005 - 19:23
Prima,
das Menü nimmt Formen an. Was muss ich tun, damit die Untermenues sich öffnen, ohne das die gesamte Seite sich nach unten verschiebt?
Ich würde es super finden wenn die Untermenues sich beim öffnen über die vorhandene HP schieben. nur wie stelle ich das an?

mp3

geschrieben von okley am 06.06.2005 - 21:27
es gibt auch einfache bzw. drop&down menus in css.
hier zwei beispiele:
http://iubito.free.fr/prog/menu/lookxp.htm
http://www.xs4all.nl/~peterned/exam....smenu.html

beide habe ich von:
http://css.maxdesign.com.au/listamatic

ein solches menu funktioniert immer und ist einfacher zu implementieren, allerdings hat es vielleicht nicht die gewünschten funktionen.


Powered by: JBB v.2.0.4 Copyright ©2000-2006, www.javarea.de.