Bonjour,
Losque je survole mon div, l'image s'enlève pour laisser appraitre un div contenant du texte et des liens.
Lorsque je quitte le div, l'image revient.

Pour cela j'utilise onMouseOver et onMouseOut, et ca marche bien. Le seul soucis et qu'il apparait un clignottement lorsque l'on quitte non pas le div, mais la partie qui contient le texte.

Vous pouvez tester ici, sur la vignette en haut à gauche.
http://edupassion.com/tests/ftp-file...emiere%20page/

Le code correspond à cela :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
 
<div id="vignetteEleve" onMouseover=" swapContentEleve(this);">
                    <img src="images/eleves.png" />
                </div>
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
 
var eleveOver=false;
 
function swapContentEleve(element)
{
    if (eleveOver ) return;
    eleveOver=true;
    var oldContent=element.innerHTML;    
    var element2=document.getElementById("survoleEleve");
    element.innerHTML=element2.innerHTML;    
}
 
function restoreEleve(){
 
    if (!eleveOver ) return;    
 
    eleveOver=false;
    /*var element2=document.getElementById("restoreEleve");*/
 
    document.getElementById('vignetteEleve').innerHTML='<img src="images/eleves.png" />';
 
}
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
 
<div id="survoleEleve"  style="height:200px; width:400px; background-color:#FFEEEE ;">
    <div id="survoleEleveContent"  class="survoleEleve" onmouseout="restoreEleve();">
 
<!--        On a un premier div servant à mettre le titre Eleve. Il s'agit d'une simple image de fond avec une cellule-->
        <div class="banniereHauteVignetteGauche">&nbsp;Houla
        </div>
 
        <!--On a ensuite le div de texte-->
        <div class="texteVignette">     
              kjfkldldfsjdfskldfsfdjsjdfskdfs sdfhkdsj<br>
              kjfkldldfsjdfskldfsfdjsjdfskdfs sdfhkdsj<br>
              kjfkldldfsjdfskldfsfdjsjdfskdfs sdfhkdsj<br>
              kjfkldldfsjdfskldfsfdjsjdfskdfs sdfhkdsj<br>
              kjfkldldfsjdfskldfsfdjsjdfskdfs sdfhkdsj<br>
              kjfkldldfsjdfskldfsfdjsjdfskdfs sdfhkdsj<br>
 
        </div>
 
 
 
    </div>
</div>
Je ne pense pas que ce soit 100% un bug de navigateur car Firefox et IE6 ont exactement le même traitement.