Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1373 connectés 

  FORUM HardWare.fr
  Programmation
  PHP

  ne raffraichir qu'une seule div

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

ne raffraichir qu'une seule div

n°1663713
bblein
Posté le 28-12-2007 à 16:18:41  profilanswer
 

Bonjour
 
 
j'ai réalisé un site avec 3 div.
celle du haut avec le menu + bandeau flash, une au milieu pour le contenu et une en pied avec aussi une anim flash.
Mon problème, c'est qu'à chaque changement de rubrique, le bandeau flash se recharge et repart au début.
j'utilise comme méthode une fonction php include.
Comment faire pour ne recharger que la div centrale de ma page?
 
 
voici le liens vers le site en test : http://jambette.free.fr/delphis/index2.php
 
merci d'avance pour vos réponses
voici le code de ma page

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5. <title>delphis</title>
  6. <style type="text/css">
  8.     <!--
  10.     body {
  11. background: #666666;
  12. margin: 0; /* il est conseillé de mettre à zéro la marge et le remplissage de l'élément body, pour tenir compte des différentes valeurs par défaut des navigateurs */
  13. padding: 0;
  14. text-align: center; /* ce paramétrage centre le conteneur dans les navigateurs IE 5.x. Le texte est ensuite aligné à gauche (valeur par défaut) dans le sélecteur #container */
  15. color: #000000;
  16. background-color: #47292A;
  17. font-family: Verdana, Arial, Helvetica, sans-serif;
  18. font-size: 100%;
  19.     }
  20. a:link {
  21. font-family: Arial, Helvetica, sans-serif;
  22. font-size: 12px;
  23. font-style: normal;
  24. color: #D28E04;
  25. text-decoration: none;
  26. }
  27. a:visited {
  28. font-family: Arial, Helvetica, sans-serif;
  29. font-size: 12px;
  30. font-style: normal;
  31. color: #47292A;
  32. text-decoration: none;
  33. }
  34. a:hover {
  35. font-family: Arial, Helvetica, sans-serif;
  36. font-size: 12px;
  37. font-style: normal;
  38. color: #D38E05;
  39. text-decoration: none;
  40. }
  42.     .oneColLiqCtrHdr #container {
  43. width: 100%;  /* ce paramétrage crée un conteneur dont la largeur est 80 % de celle du navigateur */
  44. background: #FFFFFF; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
  45. border: 0px solid #000000;
  46. text-align: left; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
  47. margin-top: 0;
  48. margin-right: auto;
  49. margin-bottom: 0;
  50. margin-left: auto;
  51.     }
  53.     .oneColLiqCtrHdr #header {
  54. padding-top: 0;
  55. padding-right: 0px;
  56. padding-bottom: 0;
  57. padding-left: 0px;
  58. background-color: #FFFFFF;
  59.     }
  61.     .oneColLiqCtrHdr #header h1 {
  62. margin: 0; /* l'utilisation de remplissage, au lieu d'une marge, permet d'éloigner l'élément des bords de l'élément div */
  63. padding-top: 0px;
  64. padding-right: 0;
  65. padding-bottom: 0px;
  66. padding-left: 0;
  67.     }
  69.     .oneColLiqCtrHdr #mainContent {
  70. padding: 0 20px; /* ne pas oublier que le remplissage est l'espace à l'intérieur du cadre de l'élément div, alors que la marge est l'espace à l'extérieur de celui-ci */
  71. background: #FFFFFF;
  72. font-family: Verdana, Arial, Helvetica, sans-serif;
  73. font-size: 10px;
  74. color: #333333;
  75.     }
  77.     .oneColLiqCtrHdr #footer {
  78. padding-top: 0;
  79. padding-right: 0px;
  80. padding-bottom: 0;
  81. padding-left: 0px;
  82. height: 38px;
  83. background-color: #DDDDDD;
  84. background-position: bottom;
  85.     }
  87.     .oneColLiqCtrHdr #footer p {
  88. margin: 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en évitant le risque de disparition de la marge */
  89. padding-top: 0px;
  90. padding-right: 0;
  91. padding-bottom: 0px;
  92. padding-left: 0;
  93.     }
  94. .Style1 {color: #47292A}
  95. .menu { position: fixed;
  96. font-family: Arial, Helvetica, sans-serif;
  97. font-size: 11px;
  98. }
  100.     -->
  102.     </style>
  103. <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
  104. <script type="text/javascript">
  105. <!--
  106. function MM_preloadImages() { //v3.0
  107.   var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
  108.     var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
  109.     if (a[i].indexOf("#" )!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
  110. }
  111. //-->
  112. </script>
  113. </head>
  115. <body class="oneColLiqCtrHdr">
  116. <?php
  117. #
  118.     // On inclue le haut de la page
  119. #
  120.     include("haut.php" );
  121. #?>
  123. <div id="container">
  125.       <div id="header">
  126.    
  127.       <tr>
  128.     <td bgcolor="#FFFFFF"><img src="medias/blanc_haut_gauche.gif" alt="blanc delphis" width="52" height="39" /><a href=""><img src="medias/btn_acceuil.jpg" alt="accueil" name="accueil delphis" width="130" height="39" border="0" id="accueil delphis" /></a><a href="?page=2" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('prepresse','','medias/btn-prepresse_r.jpg',1)"><img src="medias/btn-prepresse.jpg" alt="prepresse" name="prepresse" width="130" height="39" border="0" id="prepresse" /></a><a href="?page=3" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('impression','','medias/btn-impression_r.jpg',1)"><img src="medias/btn-impression.jpg" alt="impression" name="impression" width="130" height="39" border="0" id="impression" /></a><a href=""><img src="medias/btn-logistique.jpg" alt="logistique" name="logistique" width="130" height="39" border="0" id="logistique" /></a><img src="medias/blanc_haut_droit.gif" alt="blanc delphis" width="262" height="39" /><a href=""><img src="medias/btn-contact.jpg" alt="contact" name="contact" width="132" height="39" border="0" id="contact" /></a></td>
  129.   </tr>
  130.         <!-- fin de #header -->
  131.         <br />
  132.   </div>
  133. <div id="mainContent">
  134.       <?
  135. $page = $_GET['page'];
  136. if ($page=='1') {
  137.     include('accueil.html');
  138. } elseif ($page=='2') {
  139.     include('prepresse.html');
  140. } elseif ($page=='3') {
  141.     include('impression.html');
  142. } elseif ($page=='4') {
  143.     include('logistique.html');
  144. }elseif ($page=='5') {
  145.     include('industrie.html');
  146. }elseif ($page=='6') {
  147.     include('liens.html');
  148. } elseif ($page=='7') {
  149.     include('contact.html');
  150. } elseif ($page=='8') {
  151.     include('finitions.html');
  152. } elseif ($page=='9') {
  153.     include('logistique_promotion.html');
  154. } elseif ($page=='10') {
  155.     include('logistique_marketing.html');
  156. } elseif ($page=='11') {
  157.     include('stockage.html');
  158. } else {
  159.     include('accueil.html');
  160. }
  161. ?>
  162.   <!-- fin de #mainContent --></div>
  164. <div id="footer">
  166.         <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#47292A">
  167.           <tr>
  168.             <td><script type="text/javascript">
  169. AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','500','height','38','title','references delphis','src','medias/texte','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','medias/texte' ); //end AC code
  170.             </script>
  171.                 <noscript>
  172.                 <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="500" height="38" title="references delphis">
  173.                   <param name="movie" value="medias/texte.swf" />
  174.                   <param name="quality" value="high" />
  175.                   <embed src="medias/texte.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="500" height="38"></embed>
  176.                 </object>
  177.                 </noscript>
  178.             </td>
  179.             <td><div align="right"><img src="medias/bas.jpg" alt="bas delphis" width="540" height="38" /></div></td>
  180.           </tr>
  181.         </table>
  182.         <p>&nbsp;</p>
  184.   <!-- fin de #footer --></div>
  186. <!-- fin de #container --></div>
  188. </body>
  189. </html>

mood
Publicité
Posté le 28-12-2007 à 16:18:41  profilanswer
 

n°1663765
smartdevil
V
Posté le 28-12-2007 à 18:19:20  profilanswer
 

web 2.0 + ajax + javascript + xmlhttprequest

n°1663767
omega2
Posté le 28-12-2007 à 18:26:20  profilanswer
 

smartdevil > javascript + xmlhttprequest = (en gros) ajax
web 2.0 = on fait participer les visiteurs

Message cité 1 fois
n°1663776
dsls
Posté le 28-12-2007 à 18:52:39  profilanswer
 

... la pire des solutions étant d'utiliser des frames...
 
Mais au vu du code de ta page, l'intégration d'ajax devrait être relativement légère...

n°1663778
bblein
Posté le 28-12-2007 à 19:04:38  profilanswer
 

je suis bon pour me lancer dans le web 3.0. alors ;)
ça freinera le référencement l'ajax?
merci pour les pistes. Si vous avez un lien vers un bon tuto qui correspondrait à mon cas, n'hésitez pas pour le poster !

n°1663836
smartdevil
V
Posté le 28-12-2007 à 23:30:08  profilanswer
 

omega2 a écrit :

smartdevil > javascript + xmlhttprequest = (en gros) ajax
web 2.0 = on fait participer les visiteurs


 
javascript + xmlhttprequest = ajax  oui je suis d'accord
 
par contre le web 2.0 ce n'est pas que la participations des visiteurs mais ne trollons pas en lancant un débat


Message édité par smartdevil le 28-12-2007 à 23:30:27
n°1664100
kobhaltisa​pwner
Kick-ou-lol ? .
Posté le 30-12-2007 à 15:52:12  profilanswer
 

javascript + xmlhttprequest > Exactement ce qu'il te faut.
 
Il y a toujours la bonne vieille solution ( très moche, mais qui marche ):
<iframe></iframe>
 
<quote>je suis bon pour me lancer dans le web 3.0.</quote>
ahah (:


---------------
www.kobhqlt.no-ip.fr
n°1664546
naeh
Posté le 01-01-2008 à 23:34:52  profilanswer
 

et puis n'oublions pas non plus que tous les navigateurs actuels ont tous ce que l'on appelle Un cache :)
 
donc en réalité tes animations flash ne ralentiront le site qu'au premier chargement, après ça devrait aller sans trop de mal.


Message édité par naeh le 01-01-2008 à 23:35:49
n°1664552
bblein
Posté le 01-01-2008 à 23:39:41  profilanswer
 

c'est vrai.
finalement, je vais laisser l'anim se rafraichir à chaque clic et revenir au début
ça n'est peut-être pas si gènant que ça pour l'utilisateur.  :sarcastic:

n°1664554
Shinuza
This is unexecpected
Posté le 01-01-2008 à 23:45:24  profilanswer
 

Cache qui n'est pas eternel et limité en taille.


---------------
Mains power can kill, and it will hurt the entire time you’re dying from it.

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  PHP

  ne raffraichir qu'une seule div

 

Sujets relatifs
ecrire sur une seule ligne un programmeCode pour afficher une seule catégorie dans une page wordpress
optimisation de plusieurs regexp en une seule.Détection d'une seule touche clavier (ou combinaison de 2 touches)
Afficher le résultat d’une requête une seule fois.Prob : Affichaque que d'une seule ligne ...
Preg replace : ne fonctionne que pour une seule ligneSession qui s'efface toute seule
ouvrir une seule et unique session?comment raffraichir une seule partie d une page wew
Plus de sujets relatifs à : ne raffraichir qu'une seule div

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.124 secondes

Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR