0
votes

I am using the bootstrap 3 framework. I've created a modal window, it opens fine, I click the close button, nothing happens. I click outside the modal window and it closes returning me to my web page. I cannot get the close button to work. I've tried 'hide' 'toggle'... nothing. Any insight much appreciated!

> <div class="person">  <h2>Person name</h2> <p><a href="#"
> id="John-bio" class="position"> John Smiths Bio</a></p> 

> <div class="modal hide" id="John"> 
    > <div class="modal-header"> <h1> John Smith Bio</h1> </div> 
    > <div class="modal-body"> <p>With more than...</div> 
    > <div class="modal-footer"> <a href="#" class="btn">Close</a> </div> 

> $(function() {
> $("#John-bio").click(function(e) { e.preventDefault();
> $("#John").modal('show'); }); });
1

1 Answers

1
votes

You'll need to add a close action to the button like so: data-dismiss="modal"

<div class="modal hide" id="John"> 
    > <div class="modal-header"> <h1> John Smith Bio</h1> </div> 
    > <div class="modal-body"> <p>With more than...</div> 
    > <div class="modal-footer"> <a href="#" class="btn" data-dismiss="modal">Close</a>
</div>