Problème internet explorer + site web

Problème internet explorer + site web - HTML/CSS - Programmation

Marsh Posté le 06-05-2011 à 18:07:45    

Bonjour,
 
Je viens vous solliciter car je rencontre un problème dans la programmation de mon site web. J'ai bien sur consulté les postes parlant du même problèmes que je rencontre sans pour autant trouver une réponse.
 
En effet, le problème à l'air souvent rencontré mais traité de façon différents à chaque fois.
 
 
Je vais maintenant aborder mon problème qui se divise en deux parties :
 
Dans les 2 cas ci-dessous le site fonctionne correctement sous Firefox mais pas sous IE.
 
- les photos de mon site ne s'affiche pas sous IE, on peut le constater via le fond du site.
- mon menu déroulant en javascript qui ne se déroule pas sous IE
 
Il s'agit de mon premier site et ce problème rencontré est vraiment le seul que je n'ai su résoudre.
 
Je vous copie une partie du code.
 
Merci d'avance pour l'aide que vous pourrez m'apporter.

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html><head>
  3. <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
  5. <!-- InstanceBeginEditable name="doctitle" -->
  6. <title>Accueil - AB Prévention</title>
  7. <meta name="copyright" content="AB Prévention" lang="fr">
  8. <meta name="ROBOTS" content="index, follow">
  9. <!-- InstanceEndEditable -->
  11. <link href="Formation/style.css" rel="stylesheet" type="text/css">
  12. <script language="JavaScript" src="Formation/menu.js"></script>
  13. <script language="JavaScript" src="Formation/mm_menu.js"></script>
  14. <script language="JavaScript" type="text/JavaScript">
  15. <!--
  16. function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  17.   if (init==true) with (navigator) {if ((appName=="Netscape" )&&(parseInt(appVersion)==4)) {
  18.     document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  19.   else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
  20. }
  21. MM_reloadPage(true);
  23. function MM_preloadImages() { //v3.0
  24.   var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
  25.     var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
  26.     if (a[i].indexOf("#" )!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
  27. }
  29. function MM_swapImgRestore() { //v3.0
  30.   var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
  31. }
  33. function MM_findObj(n, d) { //v4.01
  34.   var p,i,x;  if(!d) d=document; if((p=n.indexOf("?" ))>0&&parent.frames.length) {
  35.     d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  36.   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  37.   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  38.   if(!x && d.getElementById) x=d.getElementById(n); return x;
  39. }
  41. function MM_swapImage() { //v3.0
  42.   var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  43.    if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
  44. }
  45. //-->
  46. </script>
  48. <!-- InstanceBeginEditable name="head" -->
  49. <style type="text/css">
  50. <!--
  51. .Style1 {font-size: 14px}
  52. .Style37 {color: #FFFFFF}
  53. .Style38 {font-size: 14px; font-family: Geneva, Arial, Helvetica, sans-serif; }
  54. .Style39 {font-size: 16px; font-family: Geneva, Arial, Helvetica, sans-serif;}
  55. .Style41 {color: #000000}
  56. .Style42 {
  57. color: #FFFFFF;
  58. font-family: Geneva, Arial, Helvetica, sans-serif;
  59. font-size: 14px;
  60. }
  61. -->
  62. </style>
  63. <script language="JavaScript">
  64. function ouvrir() {
  65. var index=document.forms[0].elements[0].options.selectedIndex;
  66. if (index>0)
  67.  {
  68.  var page=document.forms[0].elements[0].options[index].value;
  69.  window.open(page,"_self" );
  70. }
  71. }
  73. </script>
  74. <!-- InstanceEndEditable -->
  75. </head><body class="fond-site" onload="MM_preloadImages('../images/pixel.gif')">
  76. <script language="JavaScript1.2">mmLoadMenus();</script><span id="menuContainer"><div id="menuLayer0" style="position: absolute; z-index: 1; left: -300px; top: -300px; visibility: hidden; color: rgb(255, 255, 255); background-color: rgb(255, 255, 255); width: 250px; height: 167px;">
  77.   <div id="menuLite0" style="position: absolute; z-index: 1; left: 0px; top: 0px; height: 167px; width: 250px; background-color: rgb(255, 255, 255);" onmouseout="mouseoutMenu();">
  78.  <div id="menuFg0" style="position: absolute; left: 0px; top: 0px; height: 167px; width: 250px; background-color: rgb(255, 255, 255);">
  79. <div id="menuItem0" style="position: absolute; left: 0px; top: 0px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText0" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation sst / secourisme&nbsp;</div>
  80. <div id="menuItemHilite0" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation sst / secourisme&nbsp;</div></div><div id="menuItem1" style="position: absolute; left: 0px; top: 21px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText1" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation sst / secourisme&nbsp;</div>
  81. <div id="menuItemHilite1" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation ergonomie&nbsp;</div></div><div id="menuItem2" style="position: absolute; left: 0px; top: 42px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText2" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation ergonomie&nbsp;</div>
  82. <div id="menuItemHilite2" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation Incendie&nbsp;</div></div><div id="menuItem3" style="position: absolute; left: 0px; top: 63px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText3" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation Incendie&nbsp;</div>
  83. <div id="menuItemHilite3" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation Habilitation électrique&nbsp;</div></div><div id="menuItem4" style="position: absolute; left: 0px; top: 84px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText4" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation Habilitation électrique&nbsp;</div>
  84. <div id="menuItemHilite4" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation CACES&nbsp;</div></div><div id="menuItem5" style="position: absolute; left: 0px; top: 105px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText5" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation CACES&nbsp;</div>
  85. <div id="menuItemHilite5" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation Spécifique&nbsp;</div></div><div id="menuItem6" style="position: absolute; left: 0px; top: 126px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText6" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Formation secourisme&nbsp;</div>
  86. <div id="menuItemHilite6" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Formation secourisme&nbsp;</div></div><div id="menuItem7" style="position: absolute; left: 0px; top: 147px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; width: 250px; height: 20px; background-color: rgb(51, 51, 51); visibility: inherit;"><div id="menuItemText7" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255);">Audit , conseil et assistance  &nbsp;</div>
  87. <div id="menuItemHilite7" style="position: absolute; left: 7px; top: 3px; color: rgb(255, 255, 255); visibility: hidden;">Audit , conseil et assistance  &nbsp;</div></div>   <div id="focusItem0" style="position: absolute; left: 0px; top: -30px;" onclick="onMenuItemAction(null,this);">&nbsp;</div>
  88.    </div>
  89.   </div>
  90. </div>
  91. </span>
  93. <table align="center" border="0" cellpadding="0" cellspacing="0" width="997">
  94.   <tbody><tr>
  95.     <td><table border="0" cellpadding="0" cellspacing="0" width="997">
  96.         <tbody><tr>
  97.           <td width="333"><a href="index.html"><img src="Formation/logo.gif" alt="logo AB prevention" border="0" width="287" height="107"></a></td>
  98.           <td width="466"><span class="titre"><br>
  99.                 <span class="gras-gros">AB prévention, </span><span class="gras-gros2"><br>
  100.             votre partenaire sécurité </span></span></td>
  101.           <td class="gras" align="center" valign="top" width="198">          </td>
  102.         </tr>
  103.     </tbody></table></td>
  104.   </tr>
  105.   <tr>
  106.     <td valign="top" height="30"><table border="0" cellpadding="4" cellspacing="0" width="100%" height="30">
  107.       <tbody><tr>
  108.         <td class="fond-btn" valign="bottom" width="20%"><a href="index.html" class="lien-nav">ACCUEIL</a></td>
  109.         <td class="fond-btn" valign="bottom" width="20%"><a href="abprevention.html" class="lien-nav">QUI SOMMES NOUS ?</a></td>
  110.         <td class="fond-btn" valign="bottom" width="20%"><a href="#" class="lien-navg" target="_self" onmouseover="MM_swapImage('Image3','','../images/pixel.gif',1);MM_showMenu(window.mm_menu_0714151730_0,0,18,null,'Image3')" onmouseout="MM_swapImgRestore();MM_startTimeout()"><img src="Formation/pixel.gif" name="Image3" id="Image3" border="0" width="5" height="8">FORMATIONS SECURITE</a></td>
  111.         <td class="fond-btn" valign="bottom" width="20%"><a href="reglementation.html" class="lien-nav">REGLEMENTATION</a></td>
  112.         <td class="fond-btn" valign="bottom" width="20%"><a href="contact.html" class="lien-nav">CONTACTEZ-NOUS</a></td>
  113.       </tr>
  114.     </tbody></table></td>
  115.   </tr>
  116.   <tr>
  117.     <td valign="top"><!-- InstanceBeginEditable name="contenu" -->
  118.       <table class="fond-formation" border="1" cellpadding="10" cellspacing="0">
  119.         <tbody><tr>
  120.           <td class="fond-qui" valign="top"><table border="0" cellpadding="0" cellspacing="0" width="842">
  121.               <tbody><tr>
  122.                 <td width="35">&nbsp;</td>
  123.                 <td width="807">&nbsp;</td>
  124.               </tr>
  125.               <tr>
  126.                 <td>&nbsp;</td>
  127.                 <td valign="top">
  128.                   <p>
  129.                     <span class="Style39"> Accueil
  130.                     </span>
  131.                   </p>
  132.                   <p>&nbsp;                </p>
  133.                   <p><br>
  134.                   </p>
  135.                 </td>
  136.               </tr>
  137.           </tbody></table>          </td>
  138.         </tr>
  139.       </tbody></table>
  140.     <!-- InstanceEndEditable --></td>
  141.   </tr>
  142. </tbody></table>
  143. <script src="Formation/urchin.js" type="text/javascript">
  144. </script>
  145. <script type="text/javascript">
  146. _uacct = "UA-3449900-3";
  147. urchinTracker();
  148. </script>
  149. <!-- InstanceEnd --></body></html>


 
Le CSS :

Code :
  1. /* CSS Document */
  3. body {
  4. margin-left: 0px;
  5. margin-top: 0px;
  6. margin-right: 0px;
  7. margin-bottom: 0px;
  8. }
  9. .fond-accueil {
  10. background-image: url(images/fond_accueil.gif);
  11. background-repeat: no-repeat;
  12. height: 510px;
  13. width: 997px;
  14. background-position: left top;
  15. }
  16. .fond-i {
  17. background-image: url(images/fond-incendie.png);
  18. background-repeat: no-repeat;
  19. height: 636px;
  20. width: 997px;
  21. background-position: 98% 97%;
  22. }
  23. .fond-e {
  24. background-image: url(images/fond-ergo.png);
  25. background-repeat: no-repeat;
  26. height: 636px;
  27. width: 997px;
  28. background-position: 10% 30%;
  29. }
  30. .fond-caces {
  31. background-image: url(images/fond-caces.png);
  32. background-repeat: no-repeat;
  33. height: 636px;
  34. width: 997px;
  35. background-position: right top;
  36. }
  37. .fond-entre {
  38. background-image: url(images/fond_entre.jpg);
  39. background-repeat: no-repeat;
  40. height: 636px;
  41. width: 997px;
  42. background-position: left top;
  43. }
  44. .fond-inter{
  45. background-image: url(images/fond_inter.jpg);
  46. background-repeat: no-repeat;
  47. height: 636px;
  48. width: 997px;
  49. background-position: left top;
  50. }
  51. .fond-site {
  52. background-image: url(images/fond-g.JPG);
  53. background-repeat: no-repeat;
  54. height: 825px;
  55. width: 1650px;
  56. background-position: left top;
  57. }
  58. .fond-sitesutiles {
  59. background-image: url(images/fond_sites_utiles.jpg);
  60. background-repeat: no-repeat;
  61. height: 636px;
  62. width: 864px;
  63. background-position: left top;
  64. }
  65. .fond-stages {
  66. background-image: url(images/fond_stages_inter.jpg);
  67. background-repeat: no-repeat;
  68. height: 636px;
  69. width: 864px;
  70. background-position: left top;
  71. }
  72. .fond-formation2 {
  73. background-image: url(images/fond_formations.gif);
  74. background-repeat: no-repeat;
  75. height: 650px;
  76. width: 864px;
  77. background-position: left top;}
  78. .fond-formation {
  79. background-image: url(images/fond_formation.gif);
  80. background-repeat: no-repeat;
  81. height: 650px;
  82. width: 864px;
  83. background-position: left top;
  85. }
  86. .fond-formation {
  87. background-image: url(images/fond.gif);
  88. height: 636px;
  89. width: 997px;
  90. }
  91. .fond-nacelle {
  92. background-image: url(images/fond_nacelle.jpg);
  93. height: 636px;
  94. width: 997px;
  95. }
  96. .fond-echa {
  97. background-image: url(images/fond_echa.jpg);
  98. height: 636px;
  99. width: 997px;
  100. }
  104. .fond-formation1 {
  105. background-image: url(images/fond_formations1.gif);
  106. background-repeat: no-repeat;
  107. height: 650px;
  108. background-position: left top;
  110. }
  111. .fond-formation2 {
  112. background-image: url(images/fond_formations2.gif);
  113. background-repeat: no-repeat;
  114. height: 650px;
  115. width: 864px;
  116. background-position: left top;
  118. }
  119. .fond-formation3 {
  120. background-image: url(images/fond_formations3.gif);
  121. background-repeat: no-repeat;
  122. height: 650px;
  123. width: 864px;
  124. background-position: left top;
  126. }
  127. .fond-formation4 {
  128. background-image: url(images/fond_formation4.gif);
  129. background-repeat: no-repeat;
  130. height: 650px;
  131. width: 864px;
  132. background-position: left top;
  134. }
  135. .fond-formation5 {
  136. background-image: url(images/fond_formation5.gif);
  137. background-repeat: no-repeat;
  138. height: 650px;
  139. width: 864px;
  140. background-position: left top;
  142. }
  143. .fond-formation6 {
  144. background-image: url(images/fond_formation6.gif);
  145. background-repeat: no-repeat;
  146. height: 650px;
  147. width: 864px;
  148. background-position: left top;
  150. }
  151. .fond-formation7 {
  152. background-image: url(images/fond_formation7.gif);
  153. background-repeat: no-repeat;
  154. height: 650px;
  155. width: 864px;
  156. background-position: left top;
  158. }
  159. .fond-partenaires {
  160. background-image: url(images/fond_partenaires.jpg);
  161. background-repeat: no-repeat;
  162. height: 636px;
  163. width: 864px;
  164. background-position: left top;
  165. }

Reply

Marsh Posté le 06-05-2011 à 18:07:45   

Reply

Marsh Posté le 06-05-2011 à 23:26:25    

une url vers ton site ferait grandement avancer les choses


---------------
Blablaté par Harko
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed