Bonjour, (Je suis ultra Débutant en codage)

Après être passer par le forum java-script et n'ayant pas trouver de solutions (pas trop compris..), en ayant chercher sur google, j'ai trouvé un morceau de solution mais pas tout à fait ce que je voulais.

Je voudrais un code pour un rollover à distance en CSS pour faire exactement le système en .gif ci-dessous.

c'est à dire lorsque je met ma souris sur une ligne de texte, l'image d'en face change en fonction de la ligne ou je me trouve.

http://www.weebly.com/editor/uploads...?1412239893019

Pour le moment j'ai trouvé ça, ça fonctionne sur mon site mais c'est pas ce que je veux^^
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
<style>
a.rollover {
background:url('http://www.weebly.com/editor/uploads/3/2/2/9/32293423/custom_themes/659678222391223599/files/asyn.jpg?1412238062060') no-repeat;
width: 432px;
height: 511px;
display:block;
}
a.rollover:hover {
background:url('http://www.weebly.com/editor/uploads/3/2/2/9/32293423/custom_themes/659678222391223599/files/asynchrone.gif?1412237738955')no-repeat;
}
</style><html>
<a title="Mécanisme" href="#" class="rollover"></a></html>


Je vous remercie par avance pour les solutions données.