smd_popupdeprecated

Popup Content

Usage no npm install needed!

<script type="module">
  import smdPopup from 'https://cdn.skypack.dev/smd_popup';
</script>

README

jQuery Popup Content

Package Managers

// npm
npm install smd_popup

Set up your HTML

<div data-popup-holder>
    <a href="#" data-btn-open>Toggle Popup</a>
    <div data-popup>
        <p> Context </p>
    </div>
</div>

Call the plugin

$(document).ready(function() {
    $('[data-popup-holder]').jqContentPopup();
});

Customizing

1. Options

Variable Default Type
popup [data-popup] $(selector)
popupBtnOpen [data-btn-open] $(selector)
popupBtnClose [data-btn-close] $(selector)
activeClass popup-active string
hideOnclickOutside true boolean

2. Callbacks

Variable Default Type
onInit false function
onShow false function
onHide false function

Popup Data methods

// Initialize Plugin
$('[data-popup-holder]').jqContentPopup();
 
// Get popup instance data
var instance = $('[data-popup-holder]').data('JQContentPopup');

// Public methods
instance.showPopup(); // show popup
instance.hidePopup(); // hide popup
instance.destroy();   // destroy popup