IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

menu et compatibilité IE6


Sujet :

JavaScript

  1. #1
    Membre du Club
    Profil pro
    Inscrit en
    Mars 2009
    Messages
    204
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2009
    Messages : 204
    Points : 58
    Points
    58
    Par défaut menu et compatibilité IE6
    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?
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    /**********************************************************
    				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 */
     
    }
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
     
     
           <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>
    Merci par avance de votre aide

  2. #2
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Points : 91 220
    Points
    91 220
    Billets dans le blog
    20
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    var titre = this.getElementsByTagName("a")[0];
    var a = titre.src; titre.src = titre.alt; titre.alt = a;
    Une propriété src sur une balise <a> ? Ce serait pas plutôt href ?

  3. #3
    Expert confirmé
    Avatar de RomainVALERI
    Homme Profil pro
    POOête
    Inscrit en
    Avril 2008
    Messages
    2 652
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Meurthe et Moselle (Lorraine)

    Informations professionnelles :
    Activité : POOête

    Informations forums :
    Inscription : Avril 2008
    Messages : 2 652
    Points : 4 164
    Points
    4 164
    Par défaut
    Excuse ma question qui ne t'apportera probablement rien, mais ca m'intrigue...

    > tu fais un
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    if (window.attachEvent) window.attachEvent("onload", sfHover);
    mais il n'y a aucun else pour proposer par exemple un équivalent addEventListener aux navigateurs "FF-like"... et pourtant tu dis que ça ne marche QUE sous FF et pas IE... bizarre cette histoire quand même ^^

    Ce n'est plus une méthode propriétaire IE ce attachEvent()... ?

  4. #4
    Membre du Club
    Profil pro
    Inscrit en
    Mars 2009
    Messages
    204
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2009
    Messages : 204
    Points : 58
    Points
    58
    Par défaut
    en fait je suis une vrai débutante en java script. J'ai pris le code sur le net et on m'a aidé a le modifié .

Discussions similaires

  1. Compatibilité IE6 - OPERA 9 - FIREFOX 2
    Par tanith dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 22/05/2007, 12h31
  2. menu css compatibilité IE6/IE7
    Par dedel53 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 17/04/2007, 09h34
  3. Menu déroulant qui disparait (compatibilité IE6)
    Par theclear dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 26/01/2007, 16h42
  4. Problème compatibilité IE6 / IE7
    Par caroline73 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 12/12/2006, 17h30
  5. Probleme de menu deroulant Sous IE6
    Par Althor dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 22/09/2006, 14h31

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo