Tijden veranderen
vraag over menu
ik heb de volgende vraag: ik heb een menu in html:
<ul>
<li ><a href="home.html" target="rechts">home</a></li>
<li class="active"><a href="producten.html" target="rechts">Producten </a></li>
<li><a href="referenties.html" target="rechts">Referenties </a></li>
<li><a href="contact.html" target="rechts">Contact </a></li>
</ul>
het is de bedoeling dat als de gebruiker op de home.html pagina kijkt dat er het woord home een rode achtergrond krijgt. en als de gebruiker producten.html aanklikt dat dan de rode achtergrond van home.html verdwijnt en verplaatst wordt naar producten.html. Dus eigenlijk als de gebruiker op een huidige pagina kijkt dat er in het menu bij het desbetreffende woord een rode achtergrond te zien is.
mijn vraag is hoe doe ik dit in css?
alvast bedankt.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
(function(window, undefined) {
var document = window.document,
location = window.location.pathname || document.location.pathname;
navItems = document.getElementById('nav').getElementsByTagName('li');
for (i=-1; item = navItems[++i]; ) {
if (item.children[0].href == location) {
item.classList.add('active');
}
}
})(window);
var document = window.document,
location = window.location.pathname || document.location.pathname;
navItems = document.getElementById('nav').getElementsByTagName('li');
for (i=-1; item = navItems[++i]; ) {
if (item.children[0].href == location) {
item.classList.add('active');
}
}
})(window);