Menu CSS et behavior pour IE6

**bigltnt** · 03/04/2007, 12h54

Bonjour, je suis dans une entreprise qui utilise IE6. Je voudrais faire des menus déroulants, et j'ai trouvé pour palier le non fonctionnement de IE6 avec les hover sur les listes.

Cependant je ne comprend toujours pas pourquoi cela ne marche pas. Mais ou est mon erreur ???

Code html :

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
<body>
 
 
 
		<div id="entete">
			<img src="avatar.jpeg"/>
			<p> INTRANET </p>
		</div>
 
		<div id="conteneur">
			<div id="menu">
				<ul>
					<li> <a href="">Menu1</a>
						<ul class="smenu">
							<li>Sous-menu1</li>
							<li>Sous-menu1</li>
						</ul>
					</li>
					<li> Menu2 </li>
					<li> Menu3 </li>
				</ul>
 
			</div>
 
			<div id="contenu">
			<p>kjrjkgbhrkgbreibg</p>
			</diV>
 
		</div>
 
 
	</body>

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
 
#menu {
	width: 130px;
	height: 100%;
	float: left;
	margin: 0;
	padding: 0;
	color: gold;
	font-weight: bold;
}
 
#menu ul {
	list-style-type: none;
	margin-left: 0;
}
 
#menu ul li {
	width: 100px;
	height: 40px;
	font-family: "Rockwell Extra Bold", Andalus, "Arial Black";
	font-variant: small-caps;
	background-image: url("bouton1.jpg");
	background-repeat: no-repeat;
	line-height: 200%;
	margin: 10px;
}
 
#menu a, #menu a:visited, #menu a:link{
	display: block;
	width: 100%;
    height: 100%;
   	text-decoration: none;
 
}
 
.smenu {
	display: none;
}
 
#menu a:hover > .smenu { 
	behavior:url("csshover2.htc");
	display: block;	
}

De plus j'ai un décalage vers le bas de mes sous menu, je ne comprend pas non plus pourquoi.

Si vous voyez la solution .... merci !

PS: J'ai mis des behavior partout mais il y en a un dans le body{} du CSS

**Dan_A** · 03/04/2007, 13h51

Il n'y a pas assez d'éléments pour une réponse.
Il faudrait un lien vers une page qui montre le problème.
IE 6 ne sait pas interpréter #menu a:hover > .smenu et ne lit donc pas ce qui s'y trouve.
les fichiers htc et l'instruction behavior ne fonctionnent qu'avec IE et il vaut mieux les lier au travers de commentaires conditionnels ce qui permet de plus de ne pas mettre la pagaille pour IE 7 qui n'en a pas besoin.

**bigltnt** · 03/04/2007, 14h27

Salut ! Ben le problème c'est qu'il ne se passe rien ! Donc le lien vers la page (qui en plus est sur un intranet) ne changerais rien.

Juste le "#menu a:hover > .smenu { display: block;}" ne change rien du tout, et ne m'affiche pas la liste (<ul>et<li>) de ma classe .smenu.

Au début le hover était sur un <li> mais je l'ai changé pour essayer de le faire fonctionner. Comme je suis sur un intranet, pas la peine de se prendre la tête avec d'autres browser que IE6, seul existant dans l'entreprise.

Et le behavior:url("csshover2.htc") est la pour permettre a IE6 de gérer le hover. Mais pourquoi il ne se passe rien

Nom : Marchepo.JPG
Affichages : 78
Taille : 50,1 Ko

Voila l'aspect visuel, les menus de gauche ne réagissent pas, mais une rubrique devrait se deplier sur un "hover" pour afficher la suite de la liste, "display" initialement

**bigltnt** · 03/04/2007, 14h33

Ah oui, et voila le deuxieme problème de décalage des sous menus, je ne sais pas pourquoi. J'ai enlevé le "display"

Nom : Marchepo2.JPG
Affichages : 95
Taille : 56,5 Ko

Voici tout mon html
index.html

Et mon CSS en entier
style.css

Voila si qqun trouve une solution, merci a lui !!!!

**MasterOfChakhaL** · 03/04/2007, 14h50

Salut,

Le problème est que tu places la définition du comportement dans un endroit ou IE n'est pas capable de le voir.
Il te suffirait de déclarer le comportement pour ta page entière:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
body {
  behavior: url(...);
}

**bigltnt** · 03/04/2007, 14h55

Non c'est pas ca ! Si tu lis le fichier css (voir lien precedent message) il est déjà dans le body, l'autre c'était un test pour voir (voir quoi je sais pas mais c'était un test a l'arrache).

Merci quand meme, mais ca viens d'ailleurs

Menu CSS et behavior pour IE6

CSS

Vue hybride

Discussions similaires

Partager

Partager