Image Slider Popup Plugin With jQuery - Popup Lightbox

File Size: 8.03 KB
Views Total: 24024
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Image Slider Popup Plugin With jQuery - Popup Lightbox

The Popup Lightbox jQuery plugin displays large images in a responsive slider popup when you click the thumbnails. The users are able to slide through the images by clicking the next/prev buttons.

More features:

  • Uses animate.css for CSS3 animations.
  • Uses Font Awesome for slider controls.
  • Shows a counter that displays the current/total images.
  • Auto exacts captions from alt attribute.

See also:

How to use it:

1. Include the necessary jQuery library, Animate.css and Font Awesome Iconic Font on the web page.

<script src=""
<!--Font Awesome-->
<link rel="stylesheet" href="">
<!--Animate CSS-->
<link href="" rel="stylesheet" />

2. Include the jQuery Popup Lightbox plugin's files.

<!--Popup Lightbox Js-->
<script src="js/jquery.popup.lightbox.js"></script>
<!--Popup Lightbox CSS-->
<link href="css/popup-lightbox.css" rel="stylesheet">

3. Insert images into the slider popup.

<div class="img-container">
  <img src="" alt="Fitness" />
  <img src="" alt="jQueryScript.Net"/>
  <img src="" alt="Girls"/>
  <img src="" alt="Fashion" />

4. Call the plugin on the top container and done.




5. Customize the width & height of the slider popup.

  width: 600,
  height: 450

6. Specify the animation name (animate.css) for the slide popup.

  inAnimation: "ZoomIn"

This awesome jQuery plugin is developed by CodeHimBlog. For more Advanced Usages, please check the demo page or visit the official website.