Bonjour,
je ne comprend pas le principe j'ai une navigation sur un mini site.
www.6tnline.com/joann/
si je fait
//document.location.replace('?page=' + page);
cela recharge ma page et donc l'ajax n'est pas utilisé.
Le xhtml :
le js :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
40
41
42
43
44
45
46
47
48
49
50
51 <div id="menuPrincipal"> <ul> <li><a href="?page=accueil" title="page de présentation"> <img alt="menu" src="images/bouton.png" /> <span>accueil</span> </a></li> <li><a class="menuDeroulant" href="" title="portefeuil numérique"> <img alt="menu" src="images/bouton.png" /> <span>+ cyberfolio</span> </a></li> <li> <ul class="masquerMenu"> <li><a href="?page=videos" title="mes concepts animés"> <img alt="menu" src="images/bouton.png" /> <span>videos <span> </span></span> </a></li> <li><a href="?page=graphismes" title=""> <img alt="menu" src="images/bouton.png" /> <span>graphismes<span> </span></span> </a></li> <li><a href="?page=ambiancesSonores" title="ambiances sonnores"> <img alt="menu" src="images/bouton.png" /> <span>ambiances sonores<span> </span></span> </a></li> </ul> </li> <li><a href="?page=cv" title="ma présentation professionnelle"> <img alt="menu" src="images/bouton.png" /> <span>curriculum vitae</span> </a></li> <li><a href="?page=contact" title="contactez moi"> <img alt="menu" src="images/bouton.png" /> <span>contact</span> </a></li> </ul> </div> <div id="contenu"> <?php switch($page) { case 'accueil':include 'accueil.php'; break; case 'videos':include 'videos.php';break; case 'graphismes':include 'graphismes.php';break; case 'ambiancesSonores':include 'ambiancesSonores.php';break; case 'cv':include 'cv.php';break; case 'contact':include 'contact.php';break; default :include 'accueil.php'; } ?> </div>
Merci
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 $('#menuPrincipal ul li a').click(function(){ var $this=$(this); var page=$this.attr('href').substr(6); var contenu=$('div#contenu'); contenu.insertBefore('en chargement...'); if(page!='') { $('#menuPrincipal ul li a').css('fontWeight','normal').each(function(){ $this.css({fontWeight:'bold'}); }); //document.location.replace('?page=' + page); $.ajax({ url:page+'.php', data:'page='+page, type:'POST', global:true, cache:false, dataType:'html', contentType:'text/html', success:function(reponse){ /* contenu .animate({opacity:'toggle',height:'toggle'}, 'normal', function(){ contenu.animate({opacity:'toggle',height:'toggle'}, 'normal') .html(reponse); }); */ contenu.fadeTo(200,0,function(){ contenu.html(reponse).fadeTo(200,1); }); } }); } $this.blur(); return false; });
Partager