Monday, 9 September 2013

Why this Twitter Bootstrap 3 Modal Won't Fade?

Why this Twitter Bootstrap 3 Modal Won't Fade?

I have what should be a very simple modal using Twitter Bootstrap 3. The
modal displays no problem, but it doesn't fade in from the top, as it does
in this example, http://getbootstrap.com/javascript/#modals. Instead, it
just plonks itself on the screen.
Here's the trigger:
<a href='#registerEmail' data-toggle='modal' class='btn btn-primary
btn-lg'>Sign up with Email</a>
Here's the modal:
<div class='modal fade' id='registerEmail' tabindex='-1' role='dialog'>
<div class='modal-dialog'>
<div class='modal-content'>
<div class='modal-header'>
This is the header
</div>
<div class='modal-body'>
This is the body
</div>
<div class='modal-footer'>
This is the footer
</div>
</div>
</div>
</div>
I am pretty sure that it was working before.
I checked out this other answer, Twitter Bootstrap: Modal popup won't
fade, where the modal was nested within another .fade class, but that's
not the case with my code above.
Also, I'm including the entire bootstrap javascript file (at the bottom of
the page) so this can't be the problem. I am loading jQuery too (before
the bootstrap js).

No comments:

Post a Comment