CODEWITHSUNDEEP
javascripttwitter-bootstrapbootstrap-modalfrontend
Garrett Haley
Garrett Haley

Reputation: 3

How to properly set up a modal to appear when a button is pressed using bootstrap?

I am trying to get a modal to appear when the button below is clicked using bootstrap. I've tested it already without the "modal hide fade" and the modal appears on the page like it should. There must be something wrong with the way I have set up the button, but I'm not sure what it is. Your help is appreciated.

<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
</button>

<div id="myModal" class="modal hide fade" role="dialog">
  <div class= "modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">
          &times;
          </button>
          <h4 class="modal-title">
          modal headers
          </h4>
        </div>
        <div class="modal-footer">
           <button type="button" class="btn btn-default" data-dismiss="modal">
           Close
           </button>

        </div>
    </div>
  </div>
</div>

Upvotes: 0

Views: 37

Answers (1)

vatz88
vatz88

Reputation: 2452

Remove hide class from <div id="myModal" class="modal hide fade" role="dialog">

So it should look like <div id="myModal" class="modal fade" role="dialog">

See here, seems working well - https://jsfiddle.net/VaTz88/arkbqe9j/

Upvotes: 1

Related Questions