jQuery - vis aktiv side

Hei! Jeg holder mye p med webdesign, og har i de siste ukene sett p javascript-biblioteket jQuery. Det er skikkelig gy og stilig, og man kan gjre mye kult med det.

N i natt, mens jeg kikka p bugrapporter som har kommet til studentersamfundet-web p launchpad, kom jeg p en lsning p det utheve et bestemt menypunk som aktiv side. Det aller beste er nok lage funksjonalitet i nettsiden helt fra starten av til utheve den aktive siden, men om du ikke har gjort det og har mange forskjellige sider p nettstedet ditt, s er dette en lsning som kan fungere.

Frst m du installere jQuery p nettstedet ditt. Hvis du ikke klarer det selv, s trenger du ikke lese videre.

Videre, m du se og skjnne flgende html-kode, som blir brukt i eksemplet mitt:

<html>
<head>
<style>
#menu ul li a { text-decoration: none; }
.aktiv_side { text-decoration: underline; }
</head>
<body>
<div id="menu">
<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
</div>
</body>
</html>

Deretter legger du inn flgende javascript-kode, eller akkurat den koden du selv vil bruke, basert p denne koden:

$(document).ready(function() {
var loc = document.location;
$('.#menu ul li a').each(function(){
if( loc == $(this).attr('href') ) {
$(this).addClass('aktiv_side');
}
});
});

Om du ikke forsto dette, men trenger en slik funksjonalitet skissert over, er det bare legge igjen en kommentar under her. Lykke til med scripting og alt annet gy!

Ingen kommentarer

Skriv en ny kommentar

hits