Animation CSS3
Fermé
Jp
-
12 déc. 2013 à 15:00
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 - 13 déc. 2013 à 00:36
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 - 13 déc. 2013 à 00:36
Bonjour,
je souhaiterai créer une animation CSS avec au départ une image qui est une boite fermée, et quand on passe la souris dessus (hover) la boite s'ouvre.
Je sais qu'il faut plusieurs images mais je ne sais pas quelles sont les propriétés CSS à utiliser. Je n'ai pas trouver d'exemple bien concrêt sur le web.
Quelqu'un saurait-il où me dénicher ça?
Merci
je souhaiterai créer une animation CSS avec au départ une image qui est une boite fermée, et quand on passe la souris dessus (hover) la boite s'ouvre.
Je sais qu'il faut plusieurs images mais je ne sais pas quelles sont les propriétés CSS à utiliser. Je n'ai pas trouver d'exemple bien concrêt sur le web.
Quelqu'un saurait-il où me dénicher ça?
Merci
A voir également:
- Animation CSS3
- Dp animation maker - Télécharger - Animation
- Gpx 3d animation - Télécharger - Transports & Cartes
- Jeux animation soirée groupe 30 personnes ✓ - Forum Loisirs / Divertissements
- Idee sympas pour animer une soire ✓ - Forum Loisirs / Divertissements
- Idee animation comite des fetes ✓ - Forum Loisirs / Divertissements
1 réponse
animostab
Messages postés
2829
Date d'inscription
jeudi 10 mars 2005
Statut
Membre
Dernière intervention
11 novembre 2019
738
Modifié par animostab le 12/12/2013 à 16:19
Modifié par animostab le 12/12/2013 à 16:19
bonjour
tu trouveras ton bonheur ici
https://docs.microsoft.com/en-us/archive/blogs/
sinon plus simple tu crée
1 image boite fermé
2 image gif animé de la boite qui s'ouvre (très léger en Ko)
html
<div class="boite"></div>
css
.boite {
background-image: url(boite.gif);
}
.boite:hover {
background-image: url(boiteouvre.gif);
}
Un petit merci vaut mieux qu'une grande ignorance
tu trouveras ton bonheur ici
https://docs.microsoft.com/en-us/archive/blogs/
sinon plus simple tu crée
1 image boite fermé
2 image gif animé de la boite qui s'ouvre (très léger en Ko)
html
<div class="boite"></div>
css
.boite {
background-image: url(boite.gif);
}
.boite:hover {
background-image: url(boiteouvre.gif);
}
Un petit merci vaut mieux qu'une grande ignorance
12 déc. 2013 à 16:45
Bonne journée
13 déc. 2013 à 00:36