A light-weighted modal box is able to integrate with any web project.
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.gitattributes
.gitignore
README.md
jquery.justPopup.js
jquery.justPopup.min.js
justPopup.jquery.json
style.css

README.md

justPopup

A justPopup jQuery Plugin

How to use:

  1. Include necessary JS files

    <script src="jquery.js"></script>
    <script src="jquery.justPopup.min.js"></script>
    
  2. Add justPopup CSS file. Please tweak it to serve your needs.

    <link rel="stylesheet" href="style.css" />
    
  3. Create the following HTML element

    <div id="display">
    	Just Popup
    </div>
    <div class="overlay">
    	<div class="inner">
    		<div class="content">
    			Modal box
    		</div>
    		<span class="close"></span>
    	</div>
    	<div class="transparency"></div>
    </div>
    
  4. Fire plugin using jQuery selector

    $(function() {
    	$("#display").justPopup();
    });
    
  5. Config plugin with parameters

    $(function() {
        $("#display").justPopup({
            "color" : "#FFFFFF",
            "background-color" : "#7EB5D6",
            "width" : "500",
            "height" : "300",
            "overlayClose" : true,
            "overlayOpacity" : 0.6
        });
    });    
    
  6. Have fun:-)

Compatibility:

  • IE7 and above, Firefox, Chrome, Safari and Opera

Live Demo:

License:

Released under the MIT license.