jasonzhao6/jquery.modal.js

jQuery plugin for creating modal dialogs (IE7-9 compatible)

jQuery.modal.js

This plugin creates a modal dialog and dims the background.

It has been tested in IE7-9 and weighs less than a kilobyte.

You can download it in a zip file or view source on GitHub.

Usage

HTML

<button id='btn1' data-modal-id='#div1'>Click</button>

<div id='div1' class='modal'>
  <span class='close'>X</span>
  <p>Lorem ipsum dolor.</p>
</div>

CSS

.modal {
  display: none;
}
.modal .close {
  position: absolute;
  right: 10px;
  top: 10px;
}

JavaScript

<!-- import jQuery -->
<!-- import jQuery.modal -->
<script type='text/javascript'>
$(function() {
  $('#btn1').modal();
});
</script>