I've got this in my notes:
Simplest example in a template:
<a onclick="myModule_modal();" title="Open Modal">Open Modal</a>
<div id="myModal" class="search_box" style="display:none;">
<div style="float:right;"><input type="button" class="simplemodal-close form_button" value="x"></div>
<span class="title">Modal Title</span><br><br>
HERE IS THE MODAL CONTENT
<div class="clear"></div>
</div>
And then in your javascript:
function myModule_modal(){
$('#myModal').modal({
onOpen: function (dialog) {
dialog.overlay.fadeIn(75, function () {
dialog.container.slideDown(5, function () {
dialog.data.fadeIn(75);
});
});
},
onClose: function (dialog) {
dialog.data.fadeOut('fast', function () {
dialog.container.hide('fast', function () {
dialog.overlay.fadeOut('fast', function () {
$.modal.close();
});
});
});
},
overlayClose:true
});
}
--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)