Bonjour,

Je cherche à utiliser la fonction hover sur un div. Ca marche impec sous ie7, mais pas du tout sur ie6...
J'ai essayé d'utiliser le fichier .htc permettant d'activer le hover sur autre chose que la balise a pour ie6, mais ca ne marche pas...

Voici mon code:
css:
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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
 
 body { behavior:url("csshover.htc"); }
 
 .lefthandle:hover {
        border: 1px dotted #FF8C00;
	display: block;
	margin-top: 0px;
	left: 0px;
	background:url(doc/cursor_move.gif) no-repeat scroll 0% 100%;
	cursor: move;
	opacity: 0.700;
	width: 25px;
	height: 25px;
	float: left;
	position: absolute;
	top: auto;
 
}
 
  .lefthandle { margin: 0px;
   left: 0px;
	background: url(doc/blank.gif) repeat;
	color: Gray;
	display: block;
	margin-top: 0px;
	width: 25px;
	height: 25px;
	float: left;
	position: absolute;
	top: auto;
 }
 
  .box:hover {
	display: block;
	border: 1px Menu;
	background: InactiveBorder none repeat scroll 0% 50%;
	width: 250px;
	height: 123px;
	padding-left: 30px;
}
 
  .box {
   position: absolute;
	margin: 5px;
	padding-left: 30px;
	background: transparent none repeat scroll 0% 50%;
	width: 250px;
	height: 123px;
	z-index: 1;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	top: auto;
}
 
  .righthandle:hover {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	background: url(doc/cursor_delete.gif) no-repeat scroll 0% 50%;
	border: 1px dotted #FF8C00;
	cursor: hand;
	color: rgb(238, 238, 238);
	opacity: 0.700;
	width: 25px;
	height: 25px;
	float: right;
	position: relative;
	top: auto;
	right: auto;
}
 
  .righthandle { margin: 0px;
   height: 25px;
	color: Gray;
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	background: url(doc/blank.gif) repeat;
	width: 25px;
	float: right;
	position: relative;
	top: auto;
	right: auto;
 }
.carre_resize {
	width: 25px;
	height: 25px;
	RIGHT: 0px;
	CURSOR: se-resize;
	BOTTOM: 0px;
	POSITION: absolute;
	background: url(doc/cursor_resize.gif) no-repeat;
}
.carre_resize:hover {
	border: 1px dotted #FF8C00;
	width: 25px;
	height: 25px;
	RIGHT: 0px;
	CURSOR: se-resize;
	BOTTOM: 0px;
	POSITION: absolute;
	background: url(doc/cursor_resize.gif) no-repeat;
}
Ici les div utilisant les classes css ci dessus:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
 
<DIV class=box id=boxHandle1 style="Z-INDEX: 3; FILTER: alpha(opacity=100); LEFT: 259px; TOP: 230px; opacity: undefined" onclick="changeZindex('boxHandle1')">
<DIV class=lefthandle id=lefthandle1></DIV>
<DIV class=righthandle id=righthandle1 onclick="delDiv('boxHandle1')"></DIV>
<DIV class=carre_resize onmousedown="init(event,'boxHandle1');" id=carre_resize1></DIV>
<DIV id=boxContent1 contentEditable=true>blabla</DIV></DIV>
 
<DIV class=box id=boxHandle2 style="Z-INDEX: 2; LEFT: 21px; TOP: 100px" onclick="changeZindex('boxHandle2')">
<DIV class=lefthandle id=lefthandle2></DIV>
<DIV class=righthandle id=righthandle2 onclick="delDiv('boxHandle2')"></DIV>
<DIV class=carre_resize onmousedown="init(event,'boxHandle2');" id=carre_resize2></DIV>
<DIV id=boxContent2 contentEditable=true>blabla</DIV></DIV>
Je ne vois pas trop d'où vient mon problème...
Peut être les en-têtes du fichier contenant les div?
Je les met au cas où le problème viendrait de là:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html>
<head>
	<title>Editeur</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
Merci d'avance pour votre aide.