0

me gustaría que tras haber acabado la animación de css animation-duration: 2s; se mantuvieran los valores establecidos en las propiedades de la animación (Márgenes y demás). He intentado removiendo la anterior propiedad citada, pero no ha funcionado. ¿Alguna idea de cómo podría hacerlo? Saludos.

Código HTML:

<div class="root">


   <div class="rootieren">

        <div class="div-ae">
        <span class="AE"> CD   </span>
    </div>
    <div class="div-at">


        <span class="AT"> BT </span>
    </div>



   </div>



</div>

Código CSS:

.div-ae{
            animation-duration: 2s;
            animation-name: slidein;
            animation-direction: alternate;
        }


        @keyframes slidein {
            from {
                margin-left: -100px;
                margin-top: -5px;
                
            }

            to {
                margin-left: 100px;
                margin-top: 500px;
               
            }
        }

            .AE{
                font-size: 1.9em;
            }
0

1 respuesta 1

0

Para mantener los últimos valores de la animación, lo único que tendréis que hacer es añadir la siguiente línea al div que contenga la animación, ¡no al keyframe!

animation-fill-mode: forwards;

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.