Java script menu
Ik heb een mooie menu die uit kan klappen.
maar dat gaat alleen als er op het groene pijltje wordt gedrukt die in <span></span> komt.
Maar ik wil ook dat er als op de naam wordt geklikt dat hij uitklapt. maar hoe kan ik dat doen?
menu,js
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(document).ready(function(){
$("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled - Adds empty span tag after ul.subnav
$("ul.topnav li span").click(function() { //When trigger is clicked...
//Following events are applied to the subnav itself (moving subnav up and down)
$(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click
$(this).parent().hover(function() {
}, function(){
$(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
});
//Following events are applied to the trigger (Hover events for the trigger)
}).hover(function() {
$(this).addClass("subhover"); //On hover over, add class "subhover"
}, function(){ //On Hover Out
$(this).removeClass("subhover"); //On hover out, remove class "subhover"
});
});
$("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled - Adds empty span tag after ul.subnav
$("ul.topnav li span").click(function() { //When trigger is clicked...
//Following events are applied to the subnav itself (moving subnav up and down)
$(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click
$(this).parent().hover(function() {
}, function(){
$(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
});
//Following events are applied to the trigger (Hover events for the trigger)
}).hover(function() {
$(this).addClass("subhover"); //On hover over, add class "subhover"
}, function(){ //On Hover Out
$(this).removeClass("subhover"); //On hover out, remove class "subhover"
});
});
index.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<div id="menu2">
<ul class="topnav">
<?php
$sqlm = "SELECT id,naam,link FROM menu ORDER BY sorteren";
$querym = mysql_query($sqlm));
if(mysql_num_rows($querym) == 0){
echo '<li><a>Menu niet gevonden</a></li>';
}else{
while($row = mysql_fetch_assoc($querym)){
$sqlsm = "SELECT naam,link FROM menu_sub WHERE menu='".$row['id']."' ORDER BY sorteren";
$querysm = mysql_query($sqlsm));
if(mysql_num_rows($querysm) > 0){
echo '<li><a>'.$row['naam'].'</a>';
echo '<ul class="subnav">';
while($row2 = mysql_fetch_assoc($querysm)){
echo '<li><a href="'.$url.$row2['link'].'">'.$row2['naam'].'</a></li>';
}
echo '</ul>';
}else{
echo '<li><a href="'.$url.$row['link'].'">'.$row['naam'].'</a>';
}
echo '</li>';
}
}
if(isset($_SESSION['admin_id'])){
echo '<li><a href="'.$url.'admin"><b>Admin</b></a></li>';
echo '<li><a href="'.$url.'login/logout"><i>Uitloggen</i></a></li>';
}
?>
</ul>
</div>
<ul class="topnav">
<?php
$sqlm = "SELECT id,naam,link FROM menu ORDER BY sorteren";
$querym = mysql_query($sqlm));
if(mysql_num_rows($querym) == 0){
echo '<li><a>Menu niet gevonden</a></li>';
}else{
while($row = mysql_fetch_assoc($querym)){
$sqlsm = "SELECT naam,link FROM menu_sub WHERE menu='".$row['id']."' ORDER BY sorteren";
$querysm = mysql_query($sqlsm));
if(mysql_num_rows($querysm) > 0){
echo '<li><a>'.$row['naam'].'</a>';
echo '<ul class="subnav">';
while($row2 = mysql_fetch_assoc($querysm)){
echo '<li><a href="'.$url.$row2['link'].'">'.$row2['naam'].'</a></li>';
}
echo '</ul>';
}else{
echo '<li><a href="'.$url.$row['link'].'">'.$row['naam'].'</a>';
}
echo '</li>';
}
}
if(isset($_SESSION['admin_id'])){
echo '<li><a href="'.$url.'admin"><b>Admin</b></a></li>';
echo '<li><a href="'.$url.'login/logout"><i>Uitloggen</i></a></li>';
}
?>
</ul>
</div>
Gewijzigd op 07/02/2011 16:48:00 door Mitchel V
maar ik weet niet precies hoe.
dat is de link als hij een submenu is. maar nu wil ik dat mensen daar ook op kunnen klikken.
hoe doe ik dat?
zo als je ziet in menu.js
Gewijzigd op 08/02/2011 02:40:31 door Mitchel V
OT: Gebruik iets als dit:
Code (php)
1
$("ul.topnav li span, ul.topnav li a").click( /* function here */);
hoe kan ik dat het beste doen?