1 votos

Problema con Animate y Bootstrap (modal)

Estoy realizando un sistema en el cual por un motivo estético le agregue una animación de entrada la cual para ello estoy usando la galería css de Animate: https://daneden.github.io/animate.css/ pero con ello me da ciertos errores: enter image description here El modal como verán sale bloqueado por la pantalla oscura, esto se debe creo que al tiempo de espera de la animación, si el modal lo pongo fuera de la clase animación no habría problema, pero no puedo hacer esto ya que necesito hacer consultas dentro del contenido.

Aquí les dejo el ejemplo en código simple: https://jsfiddle.net/miguelsirna/qL8n8t1s/

2voto

Ivan Muñoz Puntos 1120

Debes agregarale al container style="animation-fill-mode: unset;" , quedaria:

<div class="container animated bounceIn" style="animation-fill-mode: unset;">

Asi me funciona ,fijate si te sirve

Tambien tendras que agregarle la animacion al modal si quieres que sea animado:

<div class="modal bs-example-modal-sm animated bounceIn" tabindex="-1" role="dialog"

0 votos

Gracias eso era :D

0 votos

De nada :)

0 votos

Ivan hola, acabo de revisarlo en Internet Explorer y me sale aun oculto https://jsfiddle.net/miguelsirna/ruoxq5pp/

1voto

aEscarcha Puntos 220

Creo que el problema es que tienes puesta la clase animated en el container, poniendola en el .modal me funciona :)

<div class="modal animated bounceIn fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">

0 votos

Ya, pero yo no quiero poner la animación en el modal, yo lo quiero en todo el contenido

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by: