JQuery met een if en else
Jquery(if werkt niet):
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$("a.menuitem").click(function(event){
$("a.menuitem").removeClass("selected");
$(this).addClass("selected");
if($("a.menuitem").id == "home")
{
$("p.body").addClass("hidden");
$("p.body#home").removeClass("hidden");
}
if($("a.menuitem").id == "about")
{
$("p.body").addClass("hidden");
$("p.body#about").removeClass("hidden");
}
event.preventDefault();
});
$("a.menuitem").removeClass("selected");
$(this).addClass("selected");
if($("a.menuitem").id == "home")
{
$("p.body").addClass("hidden");
$("p.body#home").removeClass("hidden");
}
if($("a.menuitem").id == "about")
{
$("p.body").addClass("hidden");
$("p.body#about").removeClass("hidden");
}
event.preventDefault();
});
menu:
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
<ul>
<li><a href="" class="menuitem" id="home">Home</a></li>
<li><a href="" class="menuitem" id="about">About</a></li>
<li><a href="" class="menuitem" id="contact">Contact</a></li>
<li><a href="" class="menuitem" id="gallery">Gallery</a></li>
<li><a href="" class="menuitem" id="scripts">Scripts</a></li>
<li class="last"><a href="" class="menuitem" id="links">Links</a></
li>
<div class="clear"></div>
</ul>
<li><a href="" class="menuitem" id="home">Home</a></li>
<li><a href="" class="menuitem" id="about">About</a></li>
<li><a href="" class="menuitem" id="contact">Contact</a></li>
<li><a href="" class="menuitem" id="gallery">Gallery</a></li>
<li><a href="" class="menuitem" id="scripts">Scripts</a></li>
<li class="last"><a href="" class="menuitem" id="links">Links</a></
li>
<div class="clear"></div>
</ul>
P elementen:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<p class="body" id="home">
ALL YOUR DATABASE ARE BELONG TO US.OUR DATABASE ARE BELONG TO US.
US.
</p>
<p class="body hidden" id="about">
Just a test.
</p>
ALL YOUR DATABASE ARE BELONG TO US.OUR DATABASE ARE BELONG TO US.
US.
</p>
<p class="body hidden" id="about">
Just a test.
</p>
Hoe zou ik dit beter kunnen doen? En waarom werkt mijn if statement niet?
Gewijzigd op 01/01/1970 01:00:00 door Stefan
Dit betekend: <a href="" id="menuitem"></a>
EDIT. Gefixd, alleen nog wat problemen met content switching.
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
32
33
34
35
36
37
38
39
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
32
33
34
35
36
37
38
39
<script>
$(document).ready(function(){
$("li").hide()
$("p.subtitle").hide()
$("p.copy").hide()
$("p[id=about]").hide()
var $i=500;
$("li:eq(0)").show($i, function(event){
// use callee so don't have to name the function
$i = $i+150;
$(this).next().show($i, arguments.callee, function(event){
});
$("p.subtitle").show(5250)
$("p.copy").show(5250)
});
$("a.menuitem").click(function(event){
$("a.menuitem").removeClass("selected");
$(this).addClass("selected");
if($("a.menuitem[id=home]"))
{
$("p.body").hide();
$("p.body[id=home]").show();
}
if($("a.menuitem[id=about]"))
{
$("p.body").hide();
$("p.body[id=about]").show();
}
event.preventDefault();
});
});
</script>
$(document).ready(function(){
$("li").hide()
$("p.subtitle").hide()
$("p.copy").hide()
$("p[id=about]").hide()
var $i=500;
$("li:eq(0)").show($i, function(event){
// use callee so don't have to name the function
$i = $i+150;
$(this).next().show($i, arguments.callee, function(event){
});
$("p.subtitle").show(5250)
$("p.copy").show(5250)
});
$("a.menuitem").click(function(event){
$("a.menuitem").removeClass("selected");
$(this).addClass("selected");
if($("a.menuitem[id=home]"))
{
$("p.body").hide();
$("p.body[id=home]").show();
}
if($("a.menuitem[id=about]"))
{
$("p.body").hide();
$("p.body[id=about]").show();
}
event.preventDefault();
});
});
</script>
hij switch wel naar about, maar als je danw eer op home clickt, switch ie niet terug naar de home content.
Iemand een oplossing?
Gewijzigd op 01/01/1970 01:00:00 door Stefan
Gefixd:
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
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
<script>
$(document).ready(function(){
$("li").hide()
$("p.subtitle").hide()
$("p.copy").hide()
$("p[name!=home][class=body]").hide()
var $i=500;
$("li:eq(0)").show($i, function(event){
// use callee so don't have to name the function
$i = $i+150;
$(this).next().show($i, arguments.callee, function(event){
});
$("p.subtitle").show(5250)
$("p.copy").show(5250)
});
$("a.menuitem").click(function(event){
$("a.menuitem").removeClass("selected");
$(this).addClass("selected");
$("p[name!="+this.id+"][class=body]").hide(500)
$('p[name='+this.id+']').show(500)
event.preventDefault();
});
});
</script>
$(document).ready(function(){
$("li").hide()
$("p.subtitle").hide()
$("p.copy").hide()
$("p[name!=home][class=body]").hide()
var $i=500;
$("li:eq(0)").show($i, function(event){
// use callee so don't have to name the function
$i = $i+150;
$(this).next().show($i, arguments.callee, function(event){
});
$("p.subtitle").show(5250)
$("p.copy").show(5250)
});
$("a.menuitem").click(function(event){
$("a.menuitem").removeClass("selected");
$(this).addClass("selected");
$("p[name!="+this.id+"][class=body]").hide(500)
$('p[name='+this.id+']').show(500)
event.preventDefault();
});
});
</script>
Gewijzigd op 01/01/1970 01:00:00 door Stefan