Easy Any Content Lightbox & Gallery – PlayBox.js

Category: Gallery , Javascript , Modal & Popup | December 23, 2020
Author: deepakplay
Views Total: 804 views
Official Page: Go to website
Last Update: December 23, 2020
License: MIT

Preview:

Easy Any Content Lightbox & Gallery – PlayBox.js

Description:

PlayBox.js is an easy-to-use, full-featured lightbox plugin for displaying HTML content or image galleries in a fullscreen popup.

How to use it:

1. Install the library by simply adding the PlayBox.js script to the page.

<script src="playbox.js"></script>

2. Create a trigger button to toggle the lightbox.

<button class="trigger">Open Lightbox</button>

3. Create a playbox to showcase any content in a lightbox popup. Possible parameters:

  • boxButton: Trigger button
  • boxTarget: Target content
  • enter: Animation speed (Enter)
  • exit: Animation speed (Exit)
<div class="playbox example">
  <div class="container">
    Any Content Here
  </div>
</div>
PlayBox.open('.trigger', '.example', 200, 200)

4. Create a gallery lightbox with navigation arrows and thumbnails. Possible parameters:

  • boxButton: Trigger button
  • boxTarget: Target content
  • imageList: An array of images
  • enter: Animation speed (Enter)
  • exit: Animation speed (Exit)
<div class="playboximage example"></div>
PlayBox.imageOpen('.trigger', '.example', 
  [ 
    '1.jpg',
    '2.jpg',
    '2.jpg',
    // ...
  ], 200, 200);

You Might Be Interested In:


Leave a Reply