Frontrow JS Modal Library Demos
Customizable modals for the humanity. No jQuery required and no dependencies.
Launch a basic modal
frontrow('basic');
<button class="btn" id="basic">Launch</button>
Set a title?
frontrow('theatre', {title: "To the theatre!"});
<button class="btn" id="theatre">Launch</button>
Your modal, your content
frontrow('beach', {
title: "To the beach!",
content: "#content",
width: "auto"
});
<button class="btn" id="beach">Launch</button>
<div id="content" style="display: none;">
<div>
<h4>By the sea</h4>
<img src="the_beach.jpg">
<div>
<div>
Let's change the overlay color!
frontrow('cinema', {title: "To the cinema!", overlayColor: "#bada55"});
<button class="btn" id="cinema">Launch</button>
Less transparent overlay
frontrow('park', {
title: "To the park!",
overlayColor: "#bada55",
overlayOpacity: 1
});
<button class="btn" id="park">Launch</button>
Personalize
frontrow('museum', {title: "To the museum!",
overlayColor: "#bada55",
overlayOpacity: 1,
confirmBtnText: "Let's do it!",
cancelBtnText: "later"
});
<button class="btn" id="museum">Launch</button>
By the sea