Liste deroulante (select) et IE 6
Bonjour à toute la communauté.
Je viens vers vous parce que je suis une buse en JS.
Ceci explique peut être pourquoi je n'arrive pas a résoudre un problème que je rencontre.
Je vous explique mon problème.
Je voudrais faire une liste déroulante qui a une largeur dynamique.
Lorsque que elle n'est pas cliqué elle doit faire 130px, lorsque on clique dessus (qu'elle ce déroule) elle dois passer a 300px pour permettre la lecture de tous les libellés présent et une fois que on en à sélectionné un, elle doit repasser a 130px.
Le problème c'est que je n'arrive pas a faire ce comportement sous IE6, sous Firefox ça marche.
Le problème c'est lorsque je transpose le même code pour IE6, il y a un comportement bizarre dont je n'arrive pas a me débarrasser.
Au moment du focus, la liste s'élargit bien, mais elle ne ce déroule pas au 1er clic et il semble que elle soit comme vide. Lorsque je reclique dessus les éléments sont bien la.
Pour que vous puissiez voir le comportement, voila le code que j'ai fait.
Code:
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
|
<html>
<head>
<script language="JavaScript">
<!--
function test(form, idElement, valeur, evt)
{
var selection = document.getElementById(idElement);
var largeurMin = 130;
var largeurMax = 380;
selection.options[valeur].selected = true;
if(evt == false)
{
selection.blur();
}
selection.style.width = (evt ? largeurMax:largeurMin)+'px';
}
-->
</script>
</head>
<body>
<form name="monFormulaire">
<select id=10 name="monSelect" style="width: 130px"
onFocus ='test(this.form, 10, monSelect.options.selectedIndex, true)'
onChange ='test(this.form, 10, monSelect.options.selectedIndex, false)'>
<option value=A>AA</option>
<option value=B>BBBBB</option>
<option value=C>CCCCCCCCCCC</option>
<option value=D>DDDDDDDDDDDDDDD</option>
</select>
</form>
</body>
</html> |
En espérant avoir de l'aide qui serais bien précieuse........:D
A bientôt pour la suite de l'épisode de l'espère.
