Polymer element for launch a popup with a image, iframe, inline or ajax content.
First you need bower, see their site for details
bower install --save Redbility/paper-lightbox
A simple example of its use:
<!-- LAUNCH AJAX POPUP -->
<paper-lightbox src="content.html" type="ajax">launch ajax popup</paper-lightbox>
<!-- LAUNCH IMAGE POPUP -->
<paper-lightbox src="https://unsplash.it/800/500/?image=257" type="image">launch image popup</paper-lightbox>
<!-- LAUNCH INLINE POPUP -->
<paper-lightbox src=".inline-content" type="inline">launch inline popup</paper-lightbox>
<!-- LAUNCH IFRAME POPUP -->
<paper-lightbox src="https://www.youtube.com/watch?v=assSM3rlvZ8" type="iframe">launch iframe popup</paper-lightbox>
<div style="display: none;">
<div class="inline-content">inline content example</div>
</div>
Attribute Name | Functionality | Type | Default |
---|---|---|---|
type | Popup content type | String | undefined |
closing | The time of closing animation in miliseconds | Number | undefined |
Method Name | Explanation |
---|---|
open() | Launch the popup |
Event Name | Explanation |
---|---|
onbeforeopen | Calls before modal is opened |
onafteropen | Calls after modal is opened and its content is loaded |
onbeforeclose | Calls before modal is closed |
onafterclose | Calls after modal is closed |