Multiple Modals on one page

357 Views Asked by At

I'm using a jQuery plugin for responsive, accessible modal popups. I'd like to have numerous popups on one page, but the script is written in a way that acts on id not class. I know ids must be unique, so obviously this won't work. I don't want to re-write the script for each instance. I'm sure there is another way, I just keep going in circles trying to figure it out. Is there a simple solution? If so, can you show me? jsfiddle

<button class="my_popup_open">Open First Popup</button> 

<button class="my_popup_open">Open Second Popup</button>

<div id="my_popup">...1st popup content...
<button class="my_popup_close">Close</button>
</div>

<div id="my_popup">...2nd popup content...
<button class="my_popup_close">Close</button>
</div>


<script src="http://vast-engineering.github.io/jquery-popup-overlay/jquery.popupoverlay.js"></script>

$(document).ready(function () {
$('#my_popup').popup();
});
0

There are 0 best solutions below