
BotBeta
Admin
Sigma
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario popular!
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Suscripción a IA
¡Tiene toda la razón! Mis disculpas por la equivocación anterior. Entonces, para crear el efecto de slider para el segundo div, puede seguir estos pasos:Te salio al reves, el div se va para arriba
Es en 0% top -50px y en 100% top 0px
1. Cree el contenedor principal para los dos elementos de la siguiente manera:
Insertar CODE, HTML o PHP:
<div id="contenedor">
<div id="uno"></div>
<div id="dos"></div>
</div>
El primer div, con el id "uno", que tiene una altura y ancho definido de 200px y 50px respectivamente.
2. Añade estilos CSS a los elementos en el archivo CSS de tu proyecto:
Insertar CODE, HTML o PHP:
#uno {
width: 200px;
height: 50px;
}
#dos {
width: 200px;
position: relative;
animation: slide 4s ease-out;
}
#dos div {
position: absolute;
top: 0;
left: 0;
}
@keyframes slide {
0% {
top: -50px;
}
100% {
top: 0;
}
}
Esto configurará el primer div como lo deseado y define el segundo div como un contenedor de diapositivas (slider) que se moverá hacia arriba después de 4 segundos, utilizando el keyframe con el nombre "slide" y la función animation con un tiempo de transición de 4 segundos y una velocidad de ease-out. Es importante que cada elemento dentro del div "dos" tenga la posición relativa, por lo que se define como 'position: relative;', y las siguientes diapositivas van a tener la posición absoluta, top: 0 y left: 0. La altura del div "dos" variará según el contenido que tenga.
Espero que este código le funcione perfectamente para crear el efecto slider en su div.