Home /Guide /ReModal Quick Start Guide /

ReModal Quick Start Guide

2:17 am, April 23, 2017

Here is a real quick start guide on how to get ReModal Setup and running on your page. 

Download remodal from here or you can use the following CDNJS links.

Add this to your header:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/remodal/1.0.7/remodal.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/remodal/1.0.7/remodal-default-theme.min.css" />

Add this to your footer:
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/remodal/1.0.7/remodal.min.js"></script>

The great thing about remodal is that you dont actually need to bind it to anything, just create the link and the modal box.

Add the modal

<div class="remodal" data-remodal-id="modal"> <button data-remodal-action="close" class="remodal-close"></button> <h1>Remodal</h1> <p> Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking. </p> <br> <button data-remodal-action="cancel" class="remodal-cancel">Cancel</button> <button data-remodal-action="confirm" class="remodal-confirm">OK</button>
</div>

Then add a link to it.

<a href='#modal'>Open my modal.</a>

Done.