Minimal AJAX-enabled Modal Plugin For jQuery - lolbox

File Size: 13.5 KB
Views Total: 885
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal AJAX-enabled Modal Plugin For jQuery - lolbox

lolbox is a tiny jQuery plugin for creating a nice clean modal window that features custom title, modal content, header, footer, confirm/cancel callbacks and AJAX content.

Install the plugin via NPM:

npm install lolbox

How to use it:

1. Load the lolbox plugin's stylesheet lolbox.css in the header, and the JavaScript file lolbox.js at the bottom of the webpage.

<link rel="stylesheet" href="lolbox.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="lolbox.js"></script>

2. Initialize the plugin to display a default modal window on the webpage.

$(document).lolbox();

3. Config the modal window with the following options:

$(document).lolbox({
  contents: '',
  zindex: 999,
  head: {
    use: true,
    close: true,
    title: 'Title'
  },
  foot: {
    use: true,
    close: {
      use: true,
      callback: null,
      text: 'Close'
    },
    conf: {
      use: true,
      callback: null,
      text: 'Okay'
    }
  }
});

4. If you'd like to grab content with an AJAX request.

$(document).lolbox({
  ajax: {
    use: false,
    url: null,
    method: 'get',
    dataType: 'auto',
    data: null,
    callback: null
  },
});

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