twitter bootstrap - close - Bootstrap 3.0 Modal

tooltip html

Question

Estoy atascado. Dado que Bootstrap 3.0 está a punto de ser lanzado, decidí ir con un nuevo proyecto. Las cosas van bien hasta ahora, pero por mi vida, no puedo entender cómo hacer un diálogo modal en Bootstrap 3.0.

¿Alguien tiene un ejemplo simple?

Answer 1

He encontrado un ejemplo muy bueno que también te permite descargar un archivo zip con todos los ejemplos de código sobre Booststrap 3 Modal.

• Bootstrap 3 explicación modal
• Descargue la demo Moots Bootstrap 3

¡Espero que esto te ayude también!

Answer 2

He estado luchando contra el mismo problema y gracias a esta conversación encontré mi error. Mientras usa TwitterBootstrap3, necesita las siguientes cosas:

Un botón disparador

<a data-toggle="modal"
   href="#myModal"
   class="btn btn-primary btn-lg"
>Launch demo modal</a>

Un div con esta estructura mínima:

<div class="modal fade"
     id="myModal"
     tabindex="-1"
     role="dialog"
     aria-labelledby="myModalLabel"
     aria-hidden="true"
>
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- blah blah content here -->
       </div>
   </div>
</div>

Es importante saber que si no coloca el diálogo modal y el contenido del modelo, la ventana modal no se abrirá correctamente.

Answer 3

Podría intentar compilar los documentos: Compilar los documentos de arranque de Twitter 3 (How to)? también http://bassjobsen.weblogs.fm/explore-and-install-twitter-bootstrap-3/ from the docs:

  <!-- Button trigger modal -->
  <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-lg">Launch demo modal</a>

  <!-- Modal -->
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title">Modal title</h4>
        </div>
        <div class="modal-body">
          ...
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->

Answer 4

Puedes probar simpleDialog . Este es un modal de arranque simple con devoluciones de llamada y opciones de inyección de plantilla.