Includes menu

Status
Niet open voor verdere reacties.
webhulp

webhulp

Gebruiker
Lid geworden
9 aug 2014
Berichten
27
Hallo allemaal!

Ik was aan het zoeken naar een manier dat als je een menu heb, deze overal automatisch aanpast als je iets bewerkt.
Ik kwam al snel uit op de includes manier m.b.v. PHP.
Dit lukt allemaal, maar nu is mijn vraag of er een mogelijkheid is om in mijn menu, de menu items ook (op de juiste pagina) op actief te zetten. Is dit mogelijk en zo ja hoe?

Als dit niet mogelijk is, is er dan iemand anders met een alternatief?

Alvast bedankt!
Jorian
 
Goedendag,

Dit is mogelijk met JQuery, een libery voor JavaScript.
Neem eens een kijkje op de volgende website;
LINK

m.v.g, John
 
Beste John,

Ik heb even gekeken, maar ik zou niet weten op welke manier ik dit toe moet passen in mijn menu.
Zou je me kunnen helpen?

Mvg,
Jorian
 
Goedendag,

Heeft u al eens met JQuery gewerkt?
Zo niet zou ik eerst even deze tutorial gaan volgen hoe u gebruik kan maken van JQuery in u scripts;
LINK

Vervolgens kunt u ID's toevoegen aan uw list items, vervolgens kunt u met het volgende code de class verwijderen van deze item;
$( "#Menu_01" ).removeClass( "Active" );

Met
$("#Menu_01").addClass("Active");
kunt u een class toekennen.

Indien u een class heeft voor zowel actief als non-actief kunt u het zo doen;
$( "#Menu_01" ).removeClass( "Active" ).addClass( "Normal" );

Dit betekend wel dat dit stukje code op deze manier, boven aan de pagina's die je bezoekt moet staan.
 
Dankjewel voor je reactie. Ik heb gekeken, maar volgens mij begrijp je me verkeerd (of ik snap er niets van ;) )
Ik heb deze includes pagina, waarbij ik alleen een PHP code hoef toe te voegen aan mijn pagina, zodat overal hetzelfde menu staat:
Code: 
<li><a href="#">Pagina 1</a></li>
<li><a href="#">Pagina 2</a></li>
<li><a href="#">Pagina 3</a></li>
<li><a href="#">Pagina 4</a></li>
Nu wil ik, dat als je op pagina 2 komt, het menu automatisch overspringt naar:
Code: 
<li><a href="#">Pagina 1</a></li>
<li class="active"><a href="#">Pagina 2</a></li>
<li><a href="#">Pagina 3</a></li>
<li><a href="#">Pagina 4</a></li>
Is dat mogelijk met jouw bovenstaande beschrijving, en zo ja, hoe moet ik dat dan in mijn HTML zetten?

Alvast bedankt!
 
Goedendag,

Mooi dat het gelukt is,
mijn excuses dat ik niet meer heb vergeten, had uw bericht gelezen
maar geen tijd gehad om er direct op te gaan reageren.
Vervolgens ben ik het vergeten.

Misschien is het mogelijk voor andere leden, die op dit forum stuiten de oplossing te geven?

m.v.g, John
 
Maakt niet uit, het is inderdaad wel handig voor andere leden! Als dit bijvoorbeeld het menu is:
Code: 
<ul id="menu">

<li><a href="#">Home</a></li>

<li><a href="#">Pagina</a></li>

<li><a href="#">Contact</a></li>

</ul>

Moet er dit van gemaakt worden:
Code: 
<ul id="menu">

<li class="<? if($menu['home'] == 'active') echo 'active' ?>"><a href="#">Home</a></li>

<li class="<? if($menu['pagina'] == 'active') echo 'active' ?>"><a href="#">Pagina</a></li>

<li class="<? if($menu['contact'] == 'active') echo 'active' ?>"><a href="#">Contact</a></li>

</ul>

Dit bestand sla je bijvoorbeeld op als menu.php.

In je echte pagina zet je dan op de plaats van het menu dit neer:
Code: 
<?php

$menu['home'] = 'active';

include "menu.php"

?>
Voor elke pagina hoef je alleen maar de naam (in het voorbeeld: home) aan te passen aan de echte pagina!
Werkt als een trein!

Groet,
Jorian
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan