[AJAX] Changer de page et de css en meme temps
Bonjour a tous,
J'ai créé un site avec 8 pages. Dans mon index je mets tout, il y a juste le contenu d'un div qui change et le css. Donc jai 8 css, un pour chaque page. J'ai fait le tout en php mais j'aimerai que la page reload pas. J'ai trouver comment faire en ajax. Tout fonctionne mais il y a quand meme une sorte de « flashement ». J'ai installer ajax justement pour que ca ne flash pas. voici le code
index.php
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
27
28
29
30
31
32
33
34
35
36
37
| <script type='text/JavaScript'>
var xhr = null;
function getXhr()
{
if(window.XMLHttpRequest)xhr = new XMLHttpRequest();
else if(window.ActiveXObject)
{
try{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
}
function ShowPage(page)
{
getXhr();
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById('texte').innerHTML=xhr.responseText;
}
}
xhr.open("GET","ajax.php?page="+page,true);
xhr.send(null);
}
</script>
<div id="joli" class="cjolifou"><a href="#" onClick="ShowPage('jolis')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('jolifous','','images/jolifouO.png',1)"><img src="images/jolifou.png" name="jolifous" width="160" height="30" border="0"></a></div> |
ajax.php
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| <?php
$page=$_GET['page'];
if($page==$_GET['page']){
include "francais/include/".$_GET['page'].".php";
}
else{
require "francais/include/accueil.php";
}
$page=$_GET['page'];?>
<?php
if ($_GET['page']!=''){
if ($_GET['css'] !=''){
$css=$_GET['css'];
}
else{
$css=$_GET['page'];
}
}
else {
$css='accueil';}?>
<link href="css/jolifou_<?php echo "$css" ?>.css" rel="stylesheet" type="text/css"> |
Comment éviter ce « flashement »
merci de votre aide
