Animation gif au passage de souris
Résolu/Fermé
JCBL
Messages postés
7
Date d'inscription
lundi 11 février 2008
Statut
Membre
Dernière intervention
23 juillet 2008
-
23 juil. 2008 à 14:27
spip93 Messages postés 51 Date d'inscription mardi 14 mars 2006 Statut Membre Dernière intervention 16 juin 2021 - 20 janv. 2021 à 09:36
spip93 Messages postés 51 Date d'inscription mardi 14 mars 2006 Statut Membre Dernière intervention 16 juin 2021 - 20 janv. 2021 à 09:36
A voir également:
- Animation gif au passage de souris
- Comment activer le pavé tactile sans souris - Guide
- Passage qwerty azerty - Guide
- Autoclick souris - Télécharger - Divers Utilitaires
- Gif animé gratuit - Guide
- Souris ordinateur - Guide
4 réponses
nEm3sis
Messages postés
710
Date d'inscription
lundi 20 août 2007
Statut
Membre
Dernière intervention
9 avril 2012
113
23 juil. 2008 à 14:52
23 juil. 2008 à 14:52
tu fais une image animé et une image non animé qui ne contient que la première image (de l'animation)
après suffit de faire
après suffit de faire
<img src="imagen non animé.gif" onmouseover="this.src='image animée.gif'" onmouseout="this.src='image non animée.gif'">
Xil
Messages postés
350
Date d'inscription
vendredi 18 janvier 2008
Statut
Membre
Dernière intervention
11 juin 2009
257
23 juil. 2008 à 15:38
23 juil. 2008 à 15:38
Juste pour information, il est aussi possible de le faire en CSS :
(J'utilise une balise lien, car IE6 ne comprend pas la proprété :hover sur autre chose que les liens.)
<style>
.hovergif {
background: url(images/image_statique.gif) no-repeat;
height: Xpx;
width: Ypx;
}
.hovergif:hover {
background: url(images/image_animee.gif) no-repeat;
}
</style>
(...)
<a class="hovergif"></a>
(J'utilise une balise lien, car IE6 ne comprend pas la proprété :hover sur autre chose que les liens.)
JCBL
Messages postés
7
Date d'inscription
lundi 11 février 2008
Statut
Membre
Dernière intervention
23 juillet 2008
1
23 juil. 2008 à 15:24
23 juil. 2008 à 15:24
Merci de ta reponse
JCB
JCB
paroledemains
Messages postés
1
Date d'inscription
samedi 28 mars 2009
Statut
Membre
Dernière intervention
15 avril 2013
15 avril 2013 à 01:43
15 avril 2013 à 01:43
Une image animée, l'autre non animée et après il suffit de faire ...
Oui, d'accord, mais où mettre ce code? entre quelles balises?...
De plus, je vois que ça date de 2008... ces codes sont-ils toujours d'actualité?
Oui, d'accord, mais où mettre ce code? entre quelles balises?...
De plus, je vois que ça date de 2008... ces codes sont-ils toujours d'actualité?
mc7474
Messages postés
123
Date d'inscription
dimanche 2 mars 2014
Statut
Membre
Dernière intervention
6 octobre 2014
3
Modifié par mc7474 le 7/03/2014 à 19:27
Modifié par mc7474 le 7/03/2014 à 19:27
Tu doit metre la partie
et le code, tu le met ou tu veut
de Xil, entre les balises <head></head>
<style>
.hovergif {
background: url(images/image_statique.gif) no-repeat;
height: Xpx;
width: Ypx;
}
.hovergif:hover {
background: url(images/image_animee.gif) no-repeat;
}
</style>
et le code, tu le met ou tu veut
Zorloni Maxime
<a class="havergif"></a>
20 janv. 2021 à 09:36
Cependant, j'ai un petit soucis : l'animation ne se lance pas immédiatement. La première fois, il faut que la souris reste un moment sur mon bouton (2-3 sec) pour qu'elle se lance. Ensuite, elle se lance immédiatement.
Savez-vous pourquoi ?
Je pense que c'est lié au poids de l'image GIF (il faut le temps au navigateur pour la charger), cependant, elle n'est pas si lourde (340 Ko)
En tout cas merci encore
P.S : Perso, si je peux me permettre d'être tatillon, entre la dernière guillemet (") et la balise (>) , j'ai mis des balises title="" et alt=""