Press "Enter" to skip to content

Simple and Responsive Modal Window Triggered By Links Or Forms | SI-Modal

SI Modal let’s open any page or submit any form to a responsive modal window. This Modal is a tiny jQuery plugin to create a responsive, iframe-based modal window triggered by anchor links or types submit.

How to make use of it:

Add jQuery library along with the SI-Modal plugin’s records data to the webpage.

 

Initialize the plugin and also you’re accomplished.

new SiModal({
    // options here
});

Customize the set of classes. Default: ‘modal’.

new SiModal({
    triggerClass: 'custom-trigger'
});

Determine whether or not to permit the consumer to shut the modal by an urgent ESC key. Default: true.

new SiModal({
    closeOnEscapeKeyPress: false
});

Add the next knowledge attributes to your set off anchor or kind component.

  • data-modal-close: Use a selector to specify any component(s) within the little one modal window that should instantly shut the window when clicked on (e.g. a cancel button)
  • data-modal-window-class: Add a number of (space-separated) courses that you just want to add to the outer modal window wrapper component. Good for including alternate measurement choices, e.g. modal_small

Event handlers.

  • modal-opened: Triggered when a modal window is first opened.
  • modal-closed: Triggered any time a modal window is closed.
  • modal-saved: Triggered when the content material of a modal window is loaded or reloaded and the data-modal-saved attribute is current someplace on the web page (good for triggering an ajax refresh on the parent web page after the modal is saved).
  • modal-autoclosed: Triggered when a modal window is mechanically closed because of the presence of the data-modal-autoclose attribute someplace on the web page.
  • modal-close: Trigger a ‘modal-close’ event on thetag of the parent window to close its modal

Responsive Modal Window Triggered By Links Or Forms, Simple Modal Window jQuery, HTML Open Link Modal Window


See Demo And Download

Official Website(solutioninnovators): Click Here

This superior jQuery/javascript plugin is developed by solutioninnovators. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.