Ich habe mir folgende Seite erstellt. Leider funktioniert die JQuerry Accordion nicht bei den Untermenüs. Hier wird immer nur ein Eintrag der Untermenüs angezeigt.
PHP-Code:
<html>
<head>
<title>Accordion Menü mit PHP und MYSQL</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta charset="utf-8" />
<style>
.root
{
background-color: #000000;
color: #FFCF00;
font-family: Verdana;
font-size: 14pt;
font-weight: bold;
height: 20;
padding: 5;
margin: 5;
}
.child
{
background-color: #D1D1D1;
color: #000000;
font-family: Verdana;
font-size: 10pt;
font-weight: bold;
text-decoration: underline;
height: 20;
padding: 5;
margin: 5;
}
body
{
color: #000000;
font-family: Verdana;
font-size: 8pt;
font-weight: normal;
}
a
{
color: #000000;
}
.header { background: #EFEFEF; }
.accordion { border: 1px solid #666;padding: 1px; width: 300px; }
.accord-header { background: #EFEFEF; }
.accord-header:hover { cursor: pointer; }
.accord-content { display: none; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".accordion .accord-header").click(function() {
if($(this).next("div").is(":visible")){
$(this).next("div").slideUp("slow");
} else {
$(".accordion .accord-content").slideUp("slow");
$(this).next("div").slideToggle("slow");
}
});
});
</script>
</head>
<body>
<?PHP
include "edit/config.inc.php";
include "zugriff.inc.php";
// Hier entsteht das Menü, alle Datensätze auswählen
// und nach dem Hauptmenü sortieren!
/*
<div class="accordion">
<div class="accord-header">Header 1</div>
<div class="accord-content">This is the content for the first header.</div>
<div class="accord-header">Header 2</div>
<div class="accord-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</div>
*/
$submenue = array();
$sql1 = "select * from ".CONTENT." where ParentLevel = 0 order by id asc";
$nodeResult = mysql_query($sql1,$conn);
$counter = 0;
print "<div class=\"accordion\">\n";
while($row = mysql_fetch_assoc($nodeResult))
{
// Hauptmenüs
$id = $row['id'];
$MenuName = utf8_decode($row['MenuName']);
$GetAnhang = utf8_decode($row['GetAnhang']);
$ParentLevel = $row['ParentLevel'];
// Untermenüs
$sql2 = "select * from ".CONTENT." where ParentLevel = $id";
@$childResult = mysql_query($sql2,$conn);
$Anzahl1 = mysql_num_rows($childResult);
// Wenn es kein Untermeü gibt Hauptmenü normal anzeigen
if($Anzahl1 == ""){
print "<div class=\"header\">$MenuName</div>\n";
} else {
// Wenn es ein Untermeü gibt Hauptmenü als Accordion anzeigen
print "<div class=\"accord-header\">$MenuName</div>\n";
// Wenn es ein Untermenü gibt anzeigen
while($child = mysql_fetch_array($childResult))
{
print "<div class=\"accord-content\">";
print "<a href=\"".$child['GetAnhang']."\">".$child['MenuName']."</a> \n ";
print "</div>\n";
}
}
}
print "</div>";
?>
</body>
</html>