Minimalist jQuery Modal Windows Plugin - Overlay

File Size: 18.2 KB
Views Total: 2145
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Minimalist jQuery Modal Windows Plugin - Overlay

A dead simple jQuery plugin used to create a closable modal window with a fullscreen overlay and easing effects.

More examples:

  • Example 1: Popups a modal window on page load.
  • Example 2: Popups a modal window by clicking the trigger.

How to use it:

1. Make sure to load the jQuery Overlay plugin after jQuery javascript library.

<link href="css/overlay.css" rel="stylesheet" media="screen" type="text/css" />
<script src=""></script>
<script type="text/javascript" src="js/overlay.js"></script>

2. Include the jQuery easing plugin for easing options.

<script type="text/javascript" src="js/libs/jquery.easing.1.3.js"></script>

3. Create the modal content.

<div id="overlay">

4. Popups a modal window with a time delay.

var o;

o = new Overlay();

5. Configurations.

minTop: 50,
fallbackId: 'fallback',
overlayId: 'overlay',
duration: 800,
effect: 'swing',
hasCloseBtn: true,
closeBtnClass: 'close',
closeBtnText: 'x',
hasFallbackClick: true

Change log:



  • Update


  • Update


  • Update

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