Animation CSS

Résolu

H1800 Messages postés 52 Date d'inscription Statut Membre Dernière intervention -
H1800 Messages postés 52 Date d'inscription Statut Membre Dernière intervention - 22 août 2017 à 14:25

Bonjour

j'ai un div et lorsque le visiteur pointe dessus je veux qu'il se déplace à droite pendant une seconde mais après 1 seconde il saute à sa place original

je veux qu'il reste là bas jusqu’a ce que le visiteur enlève la souris et quand il revient il revient en douceur

J'espère que vous m'avez compris!

CSS:

@-webkit-keyframes menu {
    0% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(80px);
    }
}
@keyframes menu {
    0% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(100px);
    }
}
#menu{
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: -130px;
    width: 150px;
    height: auto;
    background: #000;
}
#menu:hover{
    animation: menu 2s;
}

Merci d'avance

A voir également:

Animation CSS
Dp animation maker - Télécharger - Animation
Logiciel d animation 2d gratuit - Télécharger - Divers Web & Internet
Gpx 3d animation - Télécharger - Transports & Cartes
Css download - Télécharger - HTML
Background color css ✓ - Forum CSS

1 réponse

Réponse 1 / 1

Pitet Messages postés 2826 Date d'inscription Statut Membre Dernière intervention 527

Salut,

Une solution possible avec transition :

#menu{
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: -130px;
    width: 150px;
    height: auto;
    background: #000;
    transition: width 2s ease;
}
#menu:hover{
    width: 300px;
}

Bonne journée,

H1800 Messages postés 52 Date d'inscription Statut Membre Dernière intervention

Bonjour
Merci pour vous vous m'avez aider énormément

Discussions similaires

Idées de jeux rigolos pour un anniversaire

Enlever le soulignement sous les liens en HTML/CSS

indice et exposant en css ?

Enlever trait sous un lien href

CSS/Comment enlever couleur liens ?

Votre réponse

Discussions similaires