Erreur de script dans ma page

gaya_102 -  
Bonjour,
voila j'ai plusieurs erreurs de script dans ma page. En fait sous IE6 en bas il me marque erreur mais je ne les comprend pas 

/**********************************************************
				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: times, 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*/
	width:100%;
}
 
#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: 170px;/* largeur des sous menu*/
	border:0px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */

}
 
#menuHorizon li ul li a {
width:auto;
	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 */

}



        <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() {
            this.getElementsByTagName("ul")[0].style.display = "block";
        }
        sfEls[i].onmouseout = function() {
            this.getElementsByTagName("ul")[0].style.display = "none";
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>   


  
<div id="second">
<a href="index.html"><img id="logo" src="image/emeline_rub.jpg" alt="image/emeline_rub" /></a>
<ul id="menuHorizon">
      <li style="width:156px"><a href="presentation.php"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="leurhistoire.php">Leur histoire</a></li>
	  <li><a href="lesparents.php">Les parents des mariés</a></li>
	  
	  <li><a href="lestemoins.php">Les témoins</a></li>
	  <li><a href="enfantshonneurs.php">Les enfants d'honneurs</a></li>
	  <li><a href="toffe.php">Toffee</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau1_rub.jpg" alt="image/oiseau1_rub"/></li>

      <li style="width:78px"><a href="jourj.php"><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="infospratiques.php"><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="contact.php"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" /></a>
        
      </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>


je sais qu'il vaut mieux que je mette mes scripts dans une autre page. Mais pour le moment j'attends que tout marche bien.
Pouvez m'aider?
Configuration: Windows XP
Firefox 3.0.8

6 réponses

  • Votes
  • Date
  • Date décroissante
  1. NookZ
    Activez le débugger, vous aurez certainement une erreur plus précise :
    Outils>Options internet>Onglet Avancés > décocher les deux cases de désactivation du debugger (sous navigation dans la liste)
    1. gaya_102
      C'est fait mais en fait je ne comprend pas etant donné que je connais très mal le java script

      je sais que c'est ligne 28 car :13

      et a la ligne 28 j'ai ca <li><a href="lestemoins.php">Les témoins</a></li>
    2. NookZ
      @gaya_102Pouvez-vous me copier/coller le texte de l'erreur s'il vous plaît :)
  2. gaya_102
    ligne 28
    car 13

    this.getElementsByTagName(...).0 style à la valeur Null ou n'est pas un objet
    1. NookZ
      Ok alors

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

      sfEls contient votre menuHorizon donc un élément ul
      donc le this, référant à sfEls[i] est en fait un élément li
      Or un élément li ne contient pas d'élément ul et c'ets ce que vous lui demandez. Le js dit :
      dans menuHorizon vous trouverez des li, si l'utilisateur amène la souris sur un li alors faites apparaître l'élément ul qui se trouve à l'intérieur de mon li.
      Donc ça ne marche pas...
      1. gaya_102
        Je comprend un peu se que tu as voulu me dire.

        J'ai changé avec se que i as mis et le menu déroulant ne marche plus du tout
      2. NookZ
        @gaya_102et avec un this.parentNode.style.display à la place?
      3. gaya_102
        @NookZtu veux dire ca?

        sfEls[i].onmouseover = function() {
        this.parentNode.style.display("ul")[0].style.display = "block";
        }
      5. gaya_102
        @NookZmais je n'ai pas de else 

        
        <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() {
            this.getElementsByTagName("ul")[0].style.display = "block";
        }
        sfEls[i].onmouseout = function() {
            this.getElementsByTagName("ul")[0].style.display = "none";
        }

    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>   


  
<div id="second">
<a href="index.html"><img id="logo" src="image/emeline_rub.jpg" alt="image/emeline_rub" /></a>
<ul id="menuHorizon">
      <li style="width:156px"><a href="presentation.php"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="leurhistoire.php">Leur histoire</a></li>
	  <li><a href="lesparents.php">Les parents des mariés</a></li>
	  
	  <li><a href="lestemoins.php">Les témoins</a></li>
	  <li><a href="enfantshonneurs.php">Les enfants d'honneurs</a></li>
	  <li><a href="toffe.php">Toffee</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau1_rub.jpg" alt="image/oiseau1_rub"/></li>

      <li style="width:78px"><a href="jourj.php"><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="infospratiques.php"><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="contact.php"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" /></a>
        
      </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>
    5. NookZ
      c'est quoi la ligne 120?
      1. gaya_102
        c'est pas cohérent

        <script type="text/javascript">

        en fait le menu je l'inclue dans la page

        voila le code du menu et de la page 

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Jour J</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />



<link rel="stylesheet" href="menu.css" type="text/css" media="screen"/>
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="design_emeline4.css" />

	   
	   </head>
 
   <body>
       <div id="rubrique">        
           
		   

        <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() {
this.parentNode.style.display("ul")[0].style.display = "block";
} 
        }
        sfEls[i].onmouseout = function() {
this.parentNode.style.display("ul")[0].style.display = "none"; 
			

        }

    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
   </script>   


  
<div id="second">
<a href="index.html"><img id="logo" src="image/emeline_rub.jpg" alt="image/emeline_rub" /></a>
<ul id="menuHorizon">
      <li style="width:156px"><a href="presentation.php"><img src="image/presentation_rub_off.jpg" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
        <ul>
	  <li><a href="leurhistoire.php">Leur histoire</a></li>
	  <li><a href="lesparents.php">Les parents des mariés</a></li>
	  
	  <li><a href="lestemoins.php">Les témoins</a></li>
	  <li><a href="enfantshonneurs.php">Les enfants d'honneurs</a></li>
	  <li><a href="toffe.php">Toffee</a></li>
       </ul>
      </li>
	  <li><img src="image/oiseau1_rub.jpg" alt="image/oiseau1_rub"/></li>

      <li style="width:78px"><a href="jourj.php"><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="infospratiques.php"><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="contact.php"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" /></a>
        
      </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>


 
           <div id="texte"> 
		   
		   <br>
		  <a href="lesprestataires.php"><H2>Les prestataires</h2></a>
		 		  
		  <a href="deroulement.php"><H2>Le déroulement</H2></a>

		  <a href="voyage.php"><H2>Liste de mariage</H2></a>
		  		 
		  <a href="voyage.php"><H2>Le voyage de noce</H2></a>
		  		 
		  <a href="photo.php"><H2>Les photos</H2></a>		  	   
		   
		   </div>
		 
		   
		   </div>
		   <script type="text/javascript">
    initMenu();
</script>
		   
		   	<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>
   </body>
</html>

    Discussions similaires

    Code source couleur de fond
    Mehdi-Amg

    9 réponses
    mon écran d'accueil google chrome est décalé à droite
    89pierrot!

    7 réponses
    Erreur de lecture sur iptv smarters
    Bogs

    1 réponse