0

Quiero que cuando el div padre haya alcanzado su máximo height establecido, se active el div hijo, cómo puedo lograrlo con jquery?

<button class='activar'></button>

<div class='div-background'>
<div class='contenido-oculto'>
--Mi contenido oculto--
</div>
</div>


<style>
.div-background{
height: 0;
width: 100%;
background: yellow;
display: none;
-webkit-animation: height 2s;
animation: height 2s;
}
.contenido-oculto{
background: red;
display: none;
}
</style>



<script>
// aquí tengo una función que al dar click se activa el background padre,  pero quiero agregarle una para cuando el background padre alcanze el height establecido se active el div hijo

$('.activar').click(function(){
$('.div-background').css({
"display": "block",
"height": "200px;"
});
});
</script>

1 respuesta 1

1

Al agregar esta condicional a tu evento click comprobara si el div en este caso .div-background tenga la altura de 200px y si es verdad agregara a .contenido-oculto la propiedad de display:block para que se muestre.

$('.activar').click(function(){
    $('.div-background').css({
      display: "block",
      height: "200px"
    });

    if ($('.div-background').height() == 200) {
       $('.contenido-oculto').css({
          display: "block",
          width: "90px",
          background: "blue",
          height: "100px"
        });
    }
});
1
  • 2
    Hola Renzo, deberías tratar de explicar por qué agregar ese código es la solución. Una buena respuesta debe explicar qué está mal y cómo arreglarlo intentando que sea comprensible el 4 mar. 2019 a las 10:32

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.