From eab14efe2b57c10e243fb07aac6f67939591bab4 Mon Sep 17 00:00:00 2001 From: Christian Naths Date: Sun, 28 Oct 2012 12:55:57 -0600 Subject: [PATCH] updated README --- README.md | 37 +++++++++++++++++++------------------ 1 file changed, 19 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index d30e055..37284c1 100644 --- a/README.md +++ b/README.md @@ -19,11 +19,11 @@ Include [jQuery](http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js) an - + Include the `jquery.modal.css` stylesheet: - + As of version 0.3.0, jQuery 1.7 is required. If you're using an earlier version of jQuery you can use the [v.0.2.5 tag.](https://github.com/kylefox/jquery-modal/tags) # Opening @@ -57,11 +57,11 @@ An even simpler way is to add `rel="modal:open"` to links. When the link is cli Open an existing DOM element: Login - + Load a remote URL with AJAX: Login - + You should apply a width to all your modal elements using normal CSS. #login-form.modal { width: 400px; } @@ -73,15 +73,15 @@ The modal doesn't have a fixed height, and thus will expand & contract verticall Because there can be only one modal active at a single time, there's no need to select which modal to close: $.modal.close(); - + _TODO: this should be changed so that when called on a specific element, the element is returned (normal jQuery fashion)._ Similar to how links can be automatically bound to open modals, they can be bound to close modals using `rel="modal:close"`: Close window - + _(Note that modals loaded with AJAX are removed from the DOM when closed)._ - + # Resizing There's really no need to manually resize modals, since the default styles don't specify a fixed height; modals will expand vertically (like a normal HTML element) to fit their contents. @@ -89,7 +89,7 @@ There's really no need to manually resize modals, since the default styles don't However, when this occurs, you will probably want to at least re-center the modal in the viewport: $.modal.resize() - + # Options These are the supported options and their default values: @@ -101,12 +101,13 @@ These are the supported options and their default values: escapeClose: true, // Allows the user to close the modal by pressing `ESC` clickClose: true, // Allows the user to close the modal by clicking the overlay closeText: 'Close', // Text content for the close tag. + closeClass: '', // Add additional class(es) to the close tag. showClose: true, // Shows a (X) icon/link in the top-right corner modalClass: "modal", // CSS class added to the element being displayed in the modal. spinnerHtml: null, // HTML appended to the default spinner during AJAX requests. showSpinner: true // Enable/disable the default spinner during AJAX requests. }; - + # Events The following events are triggered on the modal element at various points in the open/close cycle (see below for AJAX events). Hopefully the names are self-explanatory. @@ -117,7 +118,7 @@ The following events are triggered on the modal element at various points in the $.modal.OPEN = 'modal:open'; $.modal.BEFORE_CLOSE = 'modal:before-close'; $.modal.CLOSE = 'modal:close'; - + The first and only argument passed to these event handlers is the `modal` object, which has three properties: modal.elm; // Original jQuery object upon which modal() was invoked. @@ -162,21 +163,21 @@ and make your AJAX request in the link's click handler. Note that you need to ma $('a[rel="ajax:modal"]').click(function(event) { $.ajax({ - + url: $(this).attr('href'), - + success: function(newHTML, textStatus, jqXHR) { - $(newHTML).appendTo('body').modal(); + $(newHTML).appendTo('body').modal(); }, - + error: function(jqXHR, textStatus, errorThrown) { // Handle AJAX errors } - + // More AJAX customization goes here. - + }); - + return false; }); @@ -213,4 +214,4 @@ jQuery Modal is distributed under the [MIT License](Learn more at http://opensou NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION - WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. \ No newline at end of file + WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.