Hvordan får man en aktiv menu med jquery. Når man klikker på et menu element skal elementet have en baggrundsfarve og de andre menu elementer skal ikke ændre baggrundsfarve.
Jeg kan kun få det til at virke ved at linke internt. Men hvordan får man det til at virke hvis jeg nu vil linke til andre sider?
Aktiv html menu med jquery
Re: Aktiv html menu med jquery
jeg tror du leder efter noget i denne stil
Kode: Vælg alt
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
</head>
<style>
ul{
width: 100%;
}
li{
float: left;
list-style: none;
display: block;
width: 50px;
height: 50px;
}
a{
display: block;
text-decoration: none;
text-align: center;
}
.click{
background-color: black;
color: white;
font-size: 24px;
}
.clearfix{
clear: both;
height: 0px;
display: block;
}
</style>
<body>
<ul>
<li>
<a>1</a>
</li>
<li>
<a>2</a>
</li>
<li>
<a>3</a>
</li>
<li>
<a>4</a>
</li>
<li>
<a>5</a>
</li>
<div class="clearfix"></div>
</ul>
<script>
$(document).ready(function(){
$("a").click(function(){
$("a").removeClass("click");
$(this).addClass("click");
});
});
</script>
</body>
</html>
Re: Aktiv html menu med jquery
Det jo nærmest det samme som jeg havde skrevet.
Jeg vil have at menuen skal være aktiv selvom et punkt linker til en anden hjemmeside.
Et godt eksempel er w3schools side. Der kan du se at det valgte menupunkt har en grøn baggrundsfarve som i dette tilfælde er html og html home.
Jeg vil have at menuen skal være aktiv selvom et punkt linker til en anden hjemmeside.
Et godt eksempel er w3schools side. Der kan du se at det valgte menupunkt har en grøn baggrundsfarve som i dette tilfælde er html og html home.