Se connecter / S'enregistrer

Résolu [HTML/JS] Problème iframe IE & Firefox

Solutions (9)
Tags :
  • Firefox
  • Programmation
|
Bonjour,

je développe un site dont le menu permet de changer le contenu d'une iframe nommée "centre" par cette fonction :

  1. function loadPage(link, frameName){
  2. frames[frameName].location.href = link;



elle est exécutée à l'évenement onclick d'un div.

Le div en question :
  1. <div id="truc" onclick="loadPage('centre/emploi.php','centre')">


La frame en question :
  1. <iframe src="centre/concept.php" id="centre" name="centre" width="70%" height="100%" scrolling="no" frameborder="0"></iframe>


Sur firefox : aucun soucis.

Sous IE8 : la cata ... Message : 'frames.centre.location' a la valeur Null ou n'est pas un objet.
Ligne : 66
Caractère : 3
Code : 0
URI : http://localhost/savannah/

Ne me demandez pas comment mais j'ai déjà vu ça et j'avais résolu le problème. Le hic c'est cette fois ci je sèche :/ 

Si quelqu'un a une idée... Merci d'avance =)
Contenus similaires
Meilleure solution
partage
, Modérateur |
Il doit y avoir un problème dans ton HTML avant l'iframe, parce que si tu prends ton code de déclaration d'iframe et que tu le montes en haut de ta page, ça fonctionne.

Edit : trouvé.
Ajoute --> à la fin de ta ligne pour fermer le commentaire
<!--document.write('<a href="mailto:'+$adresse_mail+'"><bdo dir="rtl">rf.truc@truc<\/bdo><\/a>');
  • Commenter cette solution |
Score
0
òh
òi
|
Meilleure réponse sélectionnée par xav2704.
  • Commenter cette réponse |
Score
0
òh
òi
|
Impec' ! MERCI !!! Mille merci =D Je te remercierai jamais assez. Je devais rendre le site pour aujourd'hui. Ca devrait le faire. C'était pas comme ça que j'avais résolu le problème la 1ere fois. J'avais du faire une autre bêtise à la place de celle là ^^. A plus !
  • Commenter cette réponse |
Score
0
òh
òi
|
Je suis désolé de mettre autant de code mais c'est plus compréhensible si on a une vue d'ensemble.

Code interprété par FF de la page mère :

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" rel="nofollow" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
  2.  
  3. <html xmlns="<a href="http://www.w3.org/1999/xhtml" rel="nofollow" target="_blank">http://www.w3.org/1999/xhtml</a>" lang="en" xml:lang="en">
  4.  
  5. <head>
  6.  
  7. <title>Savannah Concept</title>
  8.  
  9. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  10. <meta name="description" content=""/>
  11. <meta name="keywords" content="mode, pret à porter, vente a domicile, vente privee, vente internet"/>
  12. <meta name="robots" content="index, follow, all"/>
  13. <meta name="Author" content=""/>
  14. <meta name="copyright" content="Savannah Concept"/>
  15.  
  16. <link href="style.css" rel="stylesheet" type="text/css"/>
  17.  
  18. <script type="text/javascript">
  19. function zone_focus(zone){
  20. switch (zone.name){
  21. case "log":
  22. if (zone.value=='login') {zone.value=''}
  23. break;
  24. case "pass":
  25. if (zone.value=='password') {zone.value=''}
  26. break;
  27. }
  28. }
  29. function zone_blur(zone){
  30. switch (zone.name){
  31. case "log":
  32. if (zone.value=='') {zone.value='login'}
  33. break;
  34. case "pass":
  35. if (zone.value=='') {zone.value='password'}
  36. break;
  37. }
  38. }
  39. <!-- ============OBTENIR UNE VARIABLE ENVIRONEMENT==========-->
  40. function getVariable(variable) {
  41. var chaine=frames['centre'].location.search;
  42. var chaine=chaine.substring(1);
  43. var dz=chaine.indexOf("#",0);
  44. if(dz!=-1) {
  45. var chaine=chaine.substring(0,dz);
  46. }
  47. chaine=chaine+"&";
  48. if(chaine.indexOf(variable,0)!=-1){
  49. var pos=chaine.indexOf(variable,0);
  50. var pos2=chaine.indexOf("=",pos);
  51. var pos3=chaine.indexOf("&",pos);
  52. var contenu=chaine.substring(pos2+1,pos3);
  53. }
  54. return contenu;
  55. }
  56. <!--============================================================= -->
  57. function calcHeight(){
  58. //récupère la hauteur de la page
  59. var the_height = document.getElementById('centre').contentWindow.document.body.scrollHeight + 10;
  60. if(the_height<410)the_height = 410;
  61. //change la hauteur de l'iframe
  62. document.getElementById('centre').height = the_height;
  63. }
  64. <!--============================================================= -->
  65. function getPage(){
  66. var page = frames['centre'].location.pathname;
  67. var page = page.split("/");
  68. var page = page[page.length - 1];
  69. var page = page.substr(0, page.lastIndexOf("."));
  70. if(page!="collection"){
  71. return page;
  72. }else{
  73. var macollec = getVariable("collec");
  74. var page = page + macollec;
  75. return page;
  76. }
  77. }
  78. <!--============================================================= -->
  79. function over(zone){
  80. zone.style.backgroundColor='#BEB4B1';
  81. }
  82. <!--============================================================= -->
  83. function out(zone){
  84. var current = getPage();
  85. if(zone.id!=current)zone.style.backgroundColor='#ffffff';
  86. }
  87. <!-- ==================CLICK SUR MENU===========================-->
  88. function select(){
  89. var pages = document.getElementById('side').getElementsByTagName("div");
  90. for(i=0; i < pages.length; i++){
  91. document.getElementById(pages[i].id).style.backgroundColor='#ffffff';
  92. }
  93. var page = getPage();
  94. document.getElementById(page).style.backgroundColor='#BEB4B1';
  95. var inputs = document.getElementsByTagName("input");
  96. for(var i=0; i < inputs.length; i++){
  97. if(inputs[i].type=='button'){
  98. inputs[i].style.color = "#333333";
  99. }
  100. }
  101. var inputs = document.getElementById(page).getElementsByTagName("input");
  102. for(var i=0; i < inputs.length; i++){
  103. if(inputs[i].type=='button'){
  104. inputs[i].style.color = "#000000";
  105. }
  106. }
  107. }
  108. <!-- ============================================================ -->
  109. <!-- ============================================================ -->
  110. <!-- ============================================================ -->
  111. function loadPage(link, frameName){
  112. frames[frameName].location.href = link;
  113. }
  114. <!-- ============================================================ -->
  115. function calcTopHeight(){
  116. var top = (document.getElementById('side').offsetHeight) + 210;
  117. document.getElementById("borderBottom").style.top = top + "px";
  118.  
  119. var height_side = top-210;
  120. var height_frame = document.getElementById('centre').contentWindow.document.body.scrollHeight + 20;
  121.  
  122. if(height_frame < height_side){
  123. document.getElementById('centre').height = height_side;
  124. }
  125. }
  126. <!-- =============INITIALISATION DES VARIABLES==================-->
  127. function init(){
  128. collections = new Array();
  129. var div = document.getElementById('side').getElementsByTagName('div');
  130. for(i = 0; i < div.length; i++){
  131. monid = div[i].id;
  132. index = monid.indexOf('collections', 0);
  133. if(index != -1){
  134. collections[monid] = false;
  135. }
  136. }
  137. }
  138. <!-- ==============DEROULEMENT DU MENU JAVASCRIPT ================-->
  139. function derouler(num){
  140. var id = "collections_" + num;
  141. var open = collections[id];
  142. if(open == false){
  143. document.getElementById(id).style.display = "block";
  144. collections[id] = true;
  145. }else{
  146. document.getElementById(id).style.display = "none";
  147. collections[id] = false;
  148. }
  149. calcTopHeight();
  150. }
  151. </script>
  152.  
  153. </head>
  154.  
  155. <body onload="init();">
  156. <center>
  157. <!-- SITE -->
  158. <div id="site">
  159.  
  160. <div id="entete"><div id="monpanier" style="display:none;">
  161. <a href="#" title="Mon panier" onclick="loadPage('centre/panier.php','centre');return false"><img src="images/caddie.png" alt=""/>Mon panier</a>
  162. </div></div>
  163.  
  164.  
  165. <!-- MAIN -->
  166. <div id="main">
  167.  
  168. <div id="side">
  169. <div id="concept" class="menu" onmouseover="over(this)" onmouseout="out(this)" onclick="loadPage('centre/concept.php','centre')">
  170. <img src="images/pic1.png" alt=""/>
  171. <input type="button" value="Le Concept Savannah"/>
  172. </div>
  173. <div id="rubrique5" class="menu" onmouseover="over(this)" onmouseout="out(this)" onclick="derouler('5')">
  174. <img src="images/pic2.png" alt=""/>
  175.  
  176. <input type="button" value="gfhj"/>
  177. </div>
  178. <div id="collections_5" style="display:none;">
  179. <div id="collection7" class="collec" onmouseover="over(this)" onmouseout="out(this)" onclick="loadPage('centre/collection.php?collec=7','centre')">
  180. <input type="button" value=" ghjki"/>
  181. </div>
  182. </div>
  183. <div id="emploi" class="menu" onmouseover="over(this)" onmouseout="out(this)" onclick="loadPage('centre/emploi.php','centre')">
  184. <img src="images/pic3.png" alt=""/>
  185.  
  186. <input type="button" value="Le mode d'emploi"/>
  187. </div>
  188. <div id="preselection" class="menu" onmouseover="over(this)" onmouseout="out(this)" onclick="loadPage('centre/preselection.php','centre')">
  189. <img src="images/pic4.png" alt=""/>
  190. <input type="button" value="Présélection d'articles"/>
  191. </div>
  192. <br/>
  193. <h2>Me contacter</h2>
  194. <ul>
  195. <li><font style="font-variant:small-caps;font-weight:bold;">Florence SAURAT</font></li>
  196. <li>SHOW-ROOM</li>
  197.  
  198. <li>
  199. <script type="text/javascript">
  200. //<![CDATA[
  201. <!--document.write('<a href="mailto:'+$adresse_mail+'"><bdo dir="rtl">rf.truc@truc<\/bdo><\/a>');
  202. //]]>
  203. </script>
  204.  
  205. </li>
  206. </ul> </div>
  207. <div id="borderBottom"></div>
  208.  
  209. <!-- CONTENU AVEC MON IFRAME -->
  210. <iframe src="centre/concept.php" id="centre" name="centre" width="720" height="100%" scrolling="no" frameborder="0"></iframe>
  211. </div>
  212. <!-- FIN MAIN -->
  213.  
  214. </div>
  215. <!-- FIN SITE -->
  216.  
  217. </center>
  218. </body>
  219. </html>


Code interprété par FF de l'iframe :

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" rel="nofollow" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
  2.  
  3. <html xmlns="<a href="http://www.w3.org/1999/xhtml" rel="nofollow" target="_blank">http://www.w3.org/1999/xhtml</a>" lang="en" xml:lang="en">
  4.  
  5. <head>
  6.  
  7. <title>Savannah Concept</title>
  8.  
  9. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  10. <meta name="description" content=""/>
  11. <meta name="keywords" content=""/>
  12. <meta name="robots" content="index, follow, all"/>
  13. <meta name="Author" content=""/>
  14. <meta name="copyright" content="Savannah Concept"/>
  15.  
  16. <link href="style.css" rel="stylesheet" type="text/css"/>
  17.  
  18. <!-- Imports moodalbox -->
  19. <script type="text/javascript" src="js/mootools.js"></script>
  20. <script type="text/javascript" src="js/moodalbox.js"></script>
  21. <link type="text/css" rel="stylesheet" href="css/moodalbox.css" media="screen"/>
  22.  
  23. <script type="text/javascript">
  24. function load(){
  25. window.parent.calcHeight();
  26. window.parent.select();
  27. window.parent.calcTopHeight();
  28. window.parent.document.getElementById('monpanier').style.display = 'block';
  29. }
  30. </script>
  31.  
  32. </head>
  33.  
  34. <body onload="load()">
  35. <h1>Formulaire de présélection</h1>
  36.  
  37. </body>
  38. </html>



Voilà. Merci beaucoup pour l'aide =)
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Il va falloir plus de code que ça alors... parce que si ton iframe a un attribut id, pas de raison que ça ne le voit pas.
  • Commenter cette réponse |
Score
0
òh
òi
|
oui ça fonctionne je sais =) logique c'est une syntaxe tout à fait correcte. Mais il y a un autre problème si ça me renvoie une valeur nulle.
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Salut,

Je viens d'essayer à l'instant avec IE8 et Fx et ça fonctionne de faire un document.getElementById('centre')
  • Commenter cette réponse |
Score
0
òh
òi
|
Le hic c'est que j'ai déjà testé un truc du genre.

document.getElementById('centre') a la valeur null => Il ne semble pas reconnaitre mon objet iframe.

Merci quand même.
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Salut,

Essaie de remplacer frames[frameName].location.href = link;
par document.getElementById(frameName).src = link;
  • Commenter cette réponse |

Ce n'est pas ce que vous cherchiez ?

Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS