Probleme avec IE

gaya_102 -  
NookZ Messages postés 2376 Statut Membre -
Bonjour,
Ma page fonctionne très ben sous firefox et bien entendu sous IE6 ca plante.

http://www.sandrineetgwen.fr/emelinejourj.php

J'ai de décalages, les sous menu que s'affichent tout le temps...

Comment cela se fait il? 


       <script type="text/javascript">
   sfHover = function() {
    var sfEls = document.getElementById("menuHorizon").getElementsByTagName("li");
    for (var i=0; i<sfEls.length; i++) {
        sfEls[i].onmouseover = function() {

           var titre = this.getElementsByTagName("a")[0];
            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

            this.getElementsByTagName("ul")[0].style.display = "block";
        }
        sfEls[i].onmouseout = function() {

            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

           var titre = this.getElementsByTagName("a")[0];
            this.getElementsByTagName("ul")[0].style.display = "none";
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>    


  
<div id="second">
<img id="logo" src="image/emeline_rub.jpg" alt="image/emeline_rub" />
<ul id="menuHorizon">
      <li><a href="emelinepresentation.html"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="lesmaries.php">Les futurs mariés</a></li>
	  <li><a href="lesparents.php">Les parents des mariés</a></li>
	  <li><a href="lesfrangins.php">Les frangin(e)s</a></li>
	  <li><a href="lestemoins.php">Les témoins</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau1_rub.jpg" alt="image/oiseau1_rub"/></li>

      <li><a href="emelinejourj.html"><img src="image/jourj_rub_off.jpg" alt="image/jourj_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="prestataires.php">Les prestataires</a></li>
	  <li><a href="deroulement.php">Le déroulement</a></li>
	  <li><a href="voyage.php">Le voyage de noce</a></li>
	  <li><a href="liste.php">La liste de mariage</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau2_rub.jpg" alt="image/oiseau2_rub.jpg"></li>


      <li><a href="emelineinfospratiques.html"><img src="image/infospratiques_rub_off.jpg" alt="image/infospratiques_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="commentvenir.php">Comment venir</a></li>
	  <li><a href="hebergement.php">Hébergement</a></li>
	  
       </ul>
      </li>
	  <li><img src="image/oiseau3_rub.jpg"alt="image/oiseau3_rub.jpg"/></li>

      <li><a href="emelinecontact.html"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="#">Bob Marley</a></li>
	  <li><a href="#">Israel Vibration</a></li>
	  <li><a href="#">Tiken Jah Fakoly</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau4_rub.jpg"alt="image/oiseau4_rub.jpg"></li>


   </ul>
</div>
<script type="text/javascript">
			var imgs = document.getElementsByTagName('img');
			
			for (var i = 0; i < imgs.length; i++)
			{
				if (imgs[i].className == 'rollOver')
				{
					imgs[i].onmouseover = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
					imgs[i].onmouseout = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
					imgs[i].className = '';
				}
			}
			
			</script>




/**********************************************************
				STYLES GENERAUX
**********************************************************/
 
img { 
	border: 0; 
	display: block; 
}
 
#logo { 
	float: left;
}
 
 
/***********************************************************
					MENU HORIZONTAL
**********************************************************/
 
#menuHorizon {
	margin-left: 90px;
	padding: 0;
	margin: 0;

}
 
#menuHorizon li {
	position: relative;
	float: left; /* mes les boutons sur la gauche*/
	list-style: none;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
}
 
 
#menuHorizon li a { /* sous menu of*/
	display: block;
	line-height: 25px;/* hauteur de chaques boutons des sous menus*/
	text-decoration: none;
	color: green;/* couleur de la police*/
}
 
#menuHorizon li a:hover{ /* sous menu on*/
	background-color: black;/* couleur du fond du sous menu en on*/
	color: pink; /* couleur de la police sous menu en on*/
} 
 
#menuHorizon li ul {
	position: absolute;
	display: none;
	left: 0; /* deplace les sous menu vers la droite*/
	padding: 0;/* marge a l'interieur des sous menus vers les bord*/
	margin: 0;
	border: 1px solid #000;
	background: #fff; /* indiqueras une couleur de fond blanche */

}
 
#menuHorizon li:hover > ul {
	display: block;
}
 
#menuHorizon li ul li {
	float: none;
	width: 150px;/* largeur des sous menu*/
	border:1px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */

}
 
#menuHorizon li ul li a {
	padding: 0 5px; /* hauteur et largeur de l'ensemble de sous menu*/
	border:1px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */

}


Merci par avance de votre aide
Configuration: Windows XP
Firefox 3.0.7

6 réponses

  1.
    NookZ Messages postés 2376 Statut Membre 514
     
    j'ai fait un petit test il ne comprend pas les src.

    Pour pouvoir tester facilement sous IE. Allez dans Outils>Options internet>Onglet Avancés et décocher les deux cases de désactivation du debugger (juste en dessous de "Navigation").
    Vous aurez ainsi un aperçu des erreurs soulevées par IE.
    0
    1. gaya_102
       
      Comment je peux faire pour remédier a se probleme
      0
  2. NookZ Messages postés 2376 Statut Membre 514
     
    La var titre contient un élément de type lien (<a href"..." > </a>) cependant cet élément n'a pas d'attribut src, c'est donc normal que cela ne fonctionne pas.
    0
    1. gaya_102
       
      Je pense comprendre se que tu veux dire mais par contre je ne vois pas commet y remedier
      0
  3. NookZ Messages postés 2376 Statut Membre 514
     
    Si c'est bien cette image que vous vouliez utiliser
    <li><a href="emelinepresentation.html"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>

    ceci devrait fonctionner :
    var titre = this.getElementsByTagName("a")[0];
    à remplacer par
    var titre = this.getElementsByTagName("img")[1];
    0
    1. gaya_102
       
      J'ai fait la modif mais ca n'a pas marché 
      
       <script type="text/javascript">
   sfHover = function() {
    var sfEls = document.getElementById("menuHorizon").getElementsByTagName("li");
    for (var i=0; i<sfEls.length; i++) {
        sfEls[i].onmouseover = function() {

           var titre = this.getElementsByTagName("a")[0];
            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

            this.getElementsByTagName("ul")[0].style.display = "block";
        }
        sfEls[i].onmouseout = function() {

            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

           var titre = this.getElementsByTagName("img")[0];
            this.getElementsByTagName("ul")[0].style.display = "none";
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>    


  
<div id="second">
<img id="logo" src="image/emeline_rub.jpg" alt="image/emeline_rub" />
<ul id="menuHorizon">
      <li style="width:156px"><a href="emelinepresentation.html"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="lesmaries.php">Les futurs mariés</a></li>
	  <li><a href="lesparents.php">Les parents des mariés</a></li>
	  <li><a href="lesfrangins.php">Les frangin(e)s</a></li>
	  <li><a href="lestemoins.php">Les témoins</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau1_rub.jpg" alt="image/oiseau1_rub"/></li>

      <li style="width:78px"><a href="emelinejourj.html"><img src="image/jourj_rub_off.jpg" alt="image/jourj_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="prestataires.php">Les prestataires</a></li>
	  <li><a href="deroulement.php">Le déroulement</a></li>
	  <li><a href="voyage.php">Le voyage de noce</a></li>
	  <li><a href="liste.php">La liste de mariage</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau2_rub.jpg" alt="image/oiseau2_rub.jpg"></li>


      <li style="width:160px"><a href="emelineinfospratiques.html"><img src="image/infospratiques_rub_off.jpg" alt="image/infospratiques_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="commentvenir.php">Comment venir</a></li>
	  <li><a href="hebergement.php">Hébergement</a></li>
	  
       </ul>
      </li>
	  <li><img src="image/oiseau3_rub.jpg"alt="image/oiseau3_rub.jpg"/></li>

      <li style="width:89px"><a href="emelinecontact.html"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="#">Bob Marley</a></li>
	  <li><a href="#">Israel Vibration</a></li>
	  <li><a href="#">Tiken Jah Fakoly</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau4_rub.jpg"alt="image/oiseau4_rub.jpg"></li>


   </ul>
</div>
<script type="text/javascript">
			var imgs = document.getElementsByTagName('img');
			
			for (var i = 0; i < imgs.length; i++)
			{
				if (imgs[i].className == 'rollOver')
				{
					imgs[i].onmouseover = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
					imgs[i].onmouseout = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
					imgs[i].className = '';
				}
			}
			
			</script>
      0
  4. NookZ Messages postés 2376 Statut Membre 514
     
    Ah j'avais pas vu que t'avais deux fois la même ligne, c'est la ligne :
    var titre = this.getElementsByTagName("a")[0];
    var a = titre.src; titre.src = titre.alt; titre.alt = a;

    que tu dois modifier et avec le [1] entre crochet!
    0
    1. gaya_102
       
      je ne vois pas de [1]
      j'ai que des [0] 

      
       <script type="text/javascript">
   sfHover = function() {
    var sfEls = document.getElementById("menuHorizon").getElementsByTagName("li");
    for (var i=0; i<sfEls.length; i++) {
        sfEls[i].onmouseover = function() {

           var titre = this.getElementsByTagName("a")[0];
            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

            this.getElementsByTagName("ul")[0].style.display = "block";
        }
        sfEls[i].onmouseout = function() {

            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

           var titre = this.getElementsByTagName("a")[0];
            this.getElementsByTagName("ul")[0].style.display = "none";
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>    


  
<div id="second">
<img id="logo" src="image/emeline_rub.jpg" alt="image/emeline_rub" />
<ul id="menuHorizon">
      <li style="width:156px"><a href="emelinepresentation.html"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="lesmaries.php">Les futurs mariés</a></li>
	  <li><a href="lesparents.php">Les parents des mariés</a></li>
	  <li><a href="lesfrangins.php">Les frangin(e)s</a></li>
	  <li><a href="lestemoins.php">Les témoins</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau1_rub.jpg" alt="image/oiseau1_rub"/></li>

      <li style="width:78px"><a href="emelinejourj.html"><img src="image/jourj_rub_off.jpg" alt="image/jourj_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="prestataires.php">Les prestataires</a></li>
	  <li><a href="deroulement.php">Le déroulement</a></li>
	  <li><a href="voyage.php">Le voyage de noce</a></li>
	  <li><a href="liste.php">La liste de mariage</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau2_rub.jpg" alt="image/oiseau2_rub.jpg"></li>


      <li style="width:160px"><a href="emelineinfospratiques.html"><img src="image/infospratiques_rub_off.jpg" alt="image/infospratiques_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="commentvenir.php">Comment venir</a></li>
	  <li><a href="hebergement.php">Hébergement</a></li>
	  
       </ul>
      </li>
	  <li><img src="image/oiseau3_rub.jpg"alt="image/oiseau3_rub.jpg"/></li>

      <li style="width:89px"><a href="emelinecontact.html"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="#">Bob Marley</a></li>
	  <li><a href="#">Israel Vibration</a></li>
	  <li><a href="#">Tiken Jah Fakoly</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau4_rub.jpg"alt="image/oiseau4_rub.jpg"></li>


   </ul>
</div>
<script type="text/javascript">
			var imgs = document.getElementsByTagName('img');
			
			for (var i = 0; i < imgs.length; i++)
			{
				if (imgs[i].className == 'rollOver')
				{
					imgs[i].onmouseover = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
					imgs[i].onmouseout = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
					imgs[i].className = '';
				}
			}
			
			</script>
      0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. NookZ Messages postés 2376 Statut Membre 514
     
    var titre = this.getElementsByTagName("a")[0];
    var a = titre.src; titre.src = titre.alt; titre.alt = a;

    remplacé par

    var titre = this.getElementsByTagName("img")[1];
    var a = titre.src; titre.src = titre.alt; titre.alt = a;

    je parle du [1] deux lignes au-dessus que la première fois tu n'avais pas pris en compte
    0
  7. gaya_102
     
    du coup le menu ne marche plus 

     <script type="text/javascript">
   sfHover = function() {
    var sfEls = document.getElementById("menuHorizon").getElementsByTagName("li");
    for (var i=0; i<sfEls.length; i++) {
        sfEls[i].onmouseover = function() {

           var titre = this.getElementsByTagName("img")[1];
            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

            this.getElementsByTagName("ul")[0].style.display = "block";
        }
        sfEls[i].onmouseout = function() {

            var a = titre.src; titre.src = titre.alt; titre.alt = a; 

           var titre = this.getElementsByTagName("a")[0];
            this.getElementsByTagName("ul")[0].style.display = "none";
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>
    0
    1. NookZ Messages postés 2376 Statut Membre 514
       
      et il y a une erreur indiquée par le debugger?
      0

Discussions similaires

Prélèvement inconnu APPLE.COM/BILL ORIGINE IRL
leon274 -
HelpiOS -

1 réponse
Prélèvement Apple.com Bill
Eva_007 -
kikine -

8 réponses
Prélèvements sur Itunes.com/bill Itunes.com Lu
christinesibille -
Rahimullah -

71 réponses
Messagerie Gmail.
Cinoelle -
transat -

3 réponses
Version IE portable ou standalone
monkey_monk -
monkey_monk -

6 réponses