Simple Sliding Modal Window Plugin with jQuery - cosyModal

File Size: 7.59 KB
Views Total: 2898
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Simple Sliding Modal Window Plugin with jQuery - cosyModal

cosyModal is a simple, unobtrusive jQuery plugin for creating nice, clean and CSS styleable modal windows with configurable show/hide animations.

How to use it:

1. Load the jQuery cosyModal.js script after jQuery library.

<script src="//"></script>
<script src="jquery.cosyModal.js"></script>

2. Load the required jquery.cosyModal.css for default modal styles. You can modify and override the CSS to create your own styles.

<link rel="stylesheet" href="jquery.cosyModal.css">

3. Embed your modal content into a container with an unique CSS ID as follow.

<div id="modal-demo">
  <h1>Modal Title</h1>
  <p>Modal content</p>

4. Initialize the modal window.


5. Trigger the modal window with cosyModal('show') method.


6. Available options.


// Fixed width for the modal window.
width : 600,

// Fixed height for the modal window.
height : 'auto',

// Time in milliseconds show animation will run.
showTime : 500,

// Time in milliseconds hide animation will run.
hideTime : 250


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