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

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

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