A Brief Look

Launching a modal (plus draggable support)

document.getElementById('modal-1').onclick = function() {{
    content: '<strong>Default modal!</strong>
              <br />Testing the modal.
              <br /><
              br />Loreum ipsum dolorem the quick brown 
              fox jumped over the lazy dog.
              <br /><br />Yes its true.',
    draggable: true,
    openCallback: function () {
      alert('This is an example of the use of openCallback');

Using some of the other parameters

document.getElementById('modal-2').onclick = function() {{
    ajaxContent: '',
    width: '50%', // Can be set to px, em, %, or whatever else is out there.
    height: '50%',
    hideclose: true, // Hides the close-modal graphic
    closeAfter: 10 // Define this number in seconds.

The parameters

content: Define content here. e.g. content: 'Hello World!',
ajaxContent: Define the URL to the content (cross-domain requests not supported yet).
The width and height of the modal. If both or either of them is left blank, the default will be 'auto'. Make sure to include the format, i.e. '100px' or '100em' or '100%' etc.
draggable: Set this to true in order to make the Modal draggable. (touch support yet to be implemented).
closeAfter: Define the number in seconds. The modal will close after the provided time.
hideClose: Set this to true in order to hide the close graphic. The modal will still be escapable via the ESC key or clicking the overlay.
lock: Set this to true in order to make the modal unescapable and hides the close graphic. You will have to set a close trigger within the modal (or alternatively, closeAfter:). To set a close trigger, call: Modal.close();
openCallback: Allows you to pass a function to be run when the modal has been opened.
closeCallback: Allows you to pass a function to be run when upon closing of the modal.
hideOverlay: Disables the overlay if you set this to false.
Note: If you dont intend on using this, you don't have to include it at all when opening a modal.