changement de propriété CSS dans IE
bonjour à tous
je passe souvent sur vos forums, et c'est bien ainsi que j'ai appris. Et oui, autodidacte...:roll:
Mais aujourd'hui, je me suis inscris parce que j'ai beau farfouillé, je trouve tout sauf une solution à mon problème. Peut-être qqn aurait une piste à m'indiquer.
Voici le soucis :
Je construis un petit moteur de recherche par mots-clef qui mets en évidence les résultats en modifiant la propriété "visibility" des blocs dans la page.
Voici le HTML des blocs :
Code:
<span class="mauve"><a href="selecteur.php?a=1" class="mauve"><img id="id26" name="img35" src="images/0001.gif" width="140" height="54" border="0"></a></span>
La page est pleine de blocs similaires. l'important est ici l'ID de l'image.
Ensuite dans un fichier js externe, j'ai le code suivant :
(Pour info, TabMots est un array contenant les mots-clefs, TabID est un tableau associatif contenant les id correspondant aux mots-clefs.(j'ai utiliser 2 tableaux distincts parce que je ne suis pas arrivé à faire de recherche seulement sur les "key" d'un tableau associatif. (ce n'est pas le problème mais si quelqu'un en passant à une piste pour ça aussi, je suis preneur !))
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
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
104
105
106
107
108
|
var TabID = new Array();
var TabMots = new Array();
TabID['voiture'] = "id1,id4,id22";
TabMots.push("voiture");
TabID['fleur'] = "id1";
TabMots.push("fleur");
TabID['maquette'] = "id1";
TabMots.push("maquette");
//etc...
function SWFrecherche(args) {
var SResult = 0;
var st ='';
var TabR = new Array();
var Nid = '';
ReVisibleAll(); // Tout est remis visible au cas ou
for(var x=0; x<=(TabMots.length-1) ; x++){
lookR = TabMots[x];
if (lookR.indexOf(args) != -1){ // on recherche un bout de texte par mis les mots-clefs
if (st!=''){
st += ","+TabMC[lookR]; // si il y a un résultat, on récupère les id correspondant au mots-clefs dans l'autre tableau
}else{
st = TabMC[lookR];
}
}
}
if (st!=''){
TabR = st.split(",");
}
if (TabR.length>=1){
for(var a=1 ; a<='.$NombreId.' ; a++){
Nid='id'+a;
if(verifTab(TabR,Nid)){ // masquage
document.getElementById(Nid).style.visibility ="hidden";
}else{
document.getElementById(Nid).style.visibility ="default";
}
}
}
var SResult = TabR.length;
return SResult;
};
function verifTab(ar,val){
for(var u=0 ; u<=ar.length ; u++){
if(ar[u]==val){
return false;
}
}
return true;
};
function ReVisibleAll(){
// toutes les images sont rendues visibles avant la recherche
for(var r=1 ; r<=70 ; r++){
idC='id'+r;
document.getElementById(idC).style.visibility="default"; |
Tout fonctionne super avec Firefox (pc/mac) ou Safari, mais sur IE, rien. Après moults tests, j'en viens à suspecter la fonction RevisibleAll. Quelqu'un aurait-il un suggestion ?
je précise que je souhaite bien utiliser la propriété CSS "visiblility" et non "display", l'idée étant que les images soient masquées mais que la mise en page reste tel quel.
