Full-featured Modal Popup Plugin - jQuery iBox

Full-featured Modal Popup Plugin - jQuery iBox
File Size: 19.4 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

iBox is a simple yet full-featured jQuery popup plugin to create a responsive modal window for both static and dynamic content.

More features:

  • Supports plain text and HTML content.
  • Allows you to append more content to the existing modal window.
  • Allows you to asynchronously load an external URL.
  • Content loading indicator.

How to use it:

1. To get started, load the jQuery iBox plugin's files from the src directory.

<link href="src/css/ibox.css" rel="stylesheet">
<script src="/path/to/jquery.min.js"></script>
<script src="src/js/ibox.js"></script>

2. Create a new iBox instance and define the modal content.

const myPopup = new ibox({
      content: "Modal Content"
});

3. Display the modal window on the screen.

myPopup.open();

4. To display the modal window on page load, set the active option to true.

const myPopup = new ibox({
      active: true,
      content: "Modal Content"
});

5. Append more content to the modal window.

myPopup.content_append('New Content Here');
myPopup.content_async_append('https://www.example.com');

6. Set the modal content.

myPopup.content_set('New Content Here');
myPopup.content_async_set('https://www.example.com');

7. More useful API methods & functions.

// get the modal ID
getId();

// close the modal
close();

// execute a function when you click the modal
closeLink();

// remove the modal from the DOM
remove();

// show the loading indicator
loader_show();

// hide the loading indicator
loader_hide();

// get the modal content
content_get();

// clear the modal content
content_clear();

// show the content and hide the loading indicator
content_show();

// hide the content and show the loading indicator
content_hide();

// close a specific modal
closeIt(ibox_id)

// close event
closeEvent(event, ibox_id) 

Changelog:

2019-09-20

  • added custom events
  • controls the ability to close the iBox by the user

This awesome jQuery plugin is developed by C2H6-383. For more Advanced Usages, please check the demo page or visit the official website.