Remodal – Responsive Flat jQuery Modal Plugin with CSS3 Transitions

Remodal is a great jQuery plugin that will help you to create a flat, responsive and stylish modal window with great CSS3 transitions and full screen overlay. It looks great on both desktop and mobile devices and it is very light-weight – only ~4kb in minified version.

It is very easy to implement and to be styled.

Remodal - Responsive Flat jQuery Modal Plugin with CSS3 Transitions

DEMO | DOWNLOAD

How to use it:

The CSS – Put the css in the <head></head> section in you HTML document.

<link rel="stylesheet" href="src/jquery.remodal.css">

 The link – Put the link in the HTML:

<a href="#modal">Click</a>

The HTML – Create the HTML structure:

<div class="demo" data-remodal-id="modal">
<a href="http://www.jqueryscript.net/tags.php?/Modal/">Modal</a> Content Goes Here
<a class="remodal-cancel" href="#">Cancel</a>
<a class="remodal-confirm" href="#">OK</a>
</div>

The jQuery –  Put the jQuery javascript library and jQuery Remodal’s javascript  before the closing </body> tag.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="src/jquery.remodal.js"></script>

You are ready to go! Style it up, put some info and your modal popup is done!

Don’t struggle alone with projects

Join the creative community of UX, graphic, web designers and developers to get help with any design or dev project.


more info – https://github.com/VodkaBears/Remodal


You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *