Changement d'image au passage de la souris.

[Ami-mimi]

Bonjour tout le monde ^_^

Je vous contacte car j'ai en effet insérer sur mon forum de test ce code pour les images de mes descriptions:

Code:

<style>#image100 { background:url('http://www.archive-host.com/files/1997348/c8e1b2bdee2dc09363bb9b165b8fd40891294c7c/reglement1.png');width:106px;height:107px; } #image100:hover {background:url('http://www.archive-host.com/files/1997349/c8e1b2bdee2dc09363bb9b165b8fd40891294c7c/reglement2.png'); }</style> <div id="image100">

Cela fonctionne, aucun soucis, simplement il se trouve qu'à chaque fois que je passe la souris sur l'image, il y a un vide pendant une seconde. J'ai remarqué que cela le fait quand on entre sur le forum pour la première fois...Après cela ne le fait plus.

J'aimerais savoir si c'est possible que ça ne fasse plus cela ou si il n'y a aucune solution.

Voici l'adresse du fofo de test -> http://forumtestfree.forumgratuit.org/

Je vous remercie ♥

[AenigmA]

Bonjour, tu peux essayer ainsi avec une seule image ...qui contient les deux (sprite), c'est plus rapide car qu'une image à charger

Pas très réussie mon image mais tu comprendras le principe en la visualisant.

Code:

<style>#image100 { background:url('http://i81.servimg.com/u/f81/11/70/92/73/reglem10.png');width:106px;height:107px; } #image100:hover {background:url('http://i81.servimg.com/u/f81/11/70/92/73/reglem10.png')0 -107px; }</style> <div id="image100">

[Ami-mimi]

super merci! =)

Par contre l'image bouge un peu, est-ce normal? x)

Merci

[AenigmA]

Je l'ai fait à la va vite, elles ne sont pas centrées comme il faut. Le principal c'est que tu comprennes le principe. Bon taff

[Ami-mimi]

Justement j'ai pas trop compris comment centrer =S j'ai jamais fais ainsi...
Je vais essayé de me débrouiller merci ~

[AenigmA]

Tu doubles ta zone de travail vers le bas et tu colles la deuxième image, mais les png n'ont pas de bordure (et je n'y vois pas comme il faut) donc dur pour moi de voir 1px d'écart

[Ami-mimi]

Ah d'accord je pensais que c'était directement dans le code qu'il fallait rectifier.

Je te remercie ♥

[AenigmA]

C'est le 0 -107px; à la fin qui fait bouger l'image en fait pour prendre celle du bas

[Ami-mimi]

Oui ça javais bien remarqué ^^

Merci de m'avoir aidé!
A bientôt ~