Skip to content

Instantly share code, notes, and snippets.

@mfyance
Forked from makeusabrew/modal.html
Created September 28, 2012 20:44
Show Gist options
  • Save mfyance/3801993 to your computer and use it in GitHub Desktop.
Save mfyance/3801993 to your computer and use it in GitHub Desktop.
Twitter Bootstrap - basic dialog box invocation via JavaScript (2)
<!-- set up the modal to start hidden and fade in and out -->
<div id="myModal" class="modal hide fade">
<!-- dialog contents -->
<div class="modal-body">Hello world!</div>
<!-- dialog buttons -->
<div class="modal-footer"><a href="#" class="btn primary">OK</a></div>
</div>
$("#myModal").on("show", function() { // wire up the OK button to dismiss the modal when shown
$("#myModal a.btn").on("click", function(e) {
console.log("button pressed"); // just as an example...
$("#myModal").modal('hide'); // dismiss the dialog
});
});
$("#myModal").on("hide", function() { // remove the event listeners when the dialog is dismissed
$("#myModal a.btn").off("click");
});
$("#myModal").on("hidden", function() { // remove the actual elements from the DOM when fully hidden
$("#myModal").remove();
});
$("#myModal").modal({ // finally, wire up the actual modal functionality and show the dialog
"backdrop" : "static",
"keyboard" : true,
"show" : true // ensure the modal is shown immediately
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment