Navigation par onglets, display none pas opérationnnel
Bonjour,
j'ai un petit problème dans mon jQuery, quand je clique sur mon onglet de navigation, la page se décale bien, mais le display : none ne s'applique pas, je vous envoi mon code en vous remerciant d'avance pour votre aide :
Code:
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
|
<nav id="mainNav">
<span id="link0" class="nav"> 1 </span>
<span id="link1" class="nav"> 2 </span>
<span id="link2" class="nav"> 3 </span>
<span id="link3" class="nav"> 4 </span>
</nav>
<div id="content">
<section id="page0">
<?php include('pages/N1.php') ?>
</section>
<section id="page1">
<?php include('pages/N2.php') ?>
</section>
<section id="page2">
<?php include('pages/N3.php') ?>
</section>
<section id="page3">
<?php include('pages/N4.php') ?>
</section>
</div>
</body>
</html> |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script>
var pageActiv = 0;
<?php
for($i=0 ; $i<=3 ; $i++){ ?>
$("#link<?php echo $i; ?>" ).click(function(){
if (pageActiv != <?php echo $i; ?>){
$("#content").animate({"margin-left":"200px","opacity":"0"},400,function(){
$("#page"+pageActiv).css({"display":"none"});
$("#page<?php echo $i ?>").css({"display":"block"});
$("#content").animate({"margin-left":"-450px","opacity":"1"},500);
}); pageActiv = <?php echo $i; ?>
}
});
<?php } ?>
</script> |
