CODEWITHSUNDEEP
javascripttwitter-bootstrap
Prakash Raman
Prakash Raman

Reputation: 13923

Twitter Bootstrap Modal

The modal javascript plugin is working fine. I had a question regarding the library itself.

If you notice in this link

http://twitter.github.com/bootstrap/javascript.html#modals
// click on LAUNCH DEMO MODAL

The modal drop from the top of the screen into the vertical center of the screen. Is this functionality provided in the plugin or is it javascript that I will have to write myself ?

Thanks.

Upvotes: 0

Views: 628

Answers (2)

Bobby
Bobby

Reputation: 18305

Add the fade class to the modal in order to get this transition.

Your html should then look something like

<div id="myModal" class="modal hide fade">
  <div class="modal-header"></div>
  <div class="modal-body"></div>
  <div class="modal-footer"></div>
</div>

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

Check it out in action on JsFiddle here

From the documentation:

Heads up! If you want your modal to animate in and out, just add a .fade class to the .modal element (refer to the demo to see this in action) and include bootstrap-transition.js.

Upvotes: 1

Rush
Rush

Reputation: 873

Per the documentation, the functionality is provided in the plugin:

If you want your modal to animate in and out, just add a .fade class to the .modal element (refer to the demo to see this in action) and include bootstrap-transition.js.

Upvotes: 1

Related Questions