Tag Archives: lightbox

Full Responsive JavaScript image and video gallery

Image gallery and video galleries are unavoidable items in websites. As per the current web design trends we need more features in everything. Here is one fully responsive javascript image and video gallery that fullfil all features. Please check the following listed main features.

  • Fully responsive.
  • Modular architecture with built in plugins.
  • Touch support for mobile devices.
  • Mouse drag supports for desktops.
  • Animated thumbnails.
  • Social media sharing.
  • YouTube, Vimeo, Dailymotion, VK and HTML5 video support.
  • Full screen support.
  • Supports zoom.
  • Browser history API.
  • Responsive images.
  • HTML iframe support.
  • Keyboard Navigation for desktop.



Implement in your projects by do the following steps

Include CSS and Javascript files

CSS goes in head section
[sourcecode language=”plain”]
<link rel="stylesheet" href="css/lightgallery.css">

After that include the js library, here its lightgallery.min.css into your footer area
[sourcecode language="plain"]

<script src="js/lightgallery.min.js"></script>

<!– lightgallery plugins –>
<script src="js/lg-thumbnail.min.js"></script>
<script src="js/lg-fullscreen.min.js"></script>
The markup for light gallery

You can use your own markup too , Here am showing a sample

[sourcecode language=”plain”]
<div id="lightgallery">
<a href="img/img1.jpg">
<img src="img/thumb1.jpg">
<a href="img/img2.jpg">
<img src="img/thumb2.jpg">


Initialize the plugin
[sourcecode language=”plain”]

Demo Read More Download

jQuery Touch enabled, responsive lightbox for displaying images, videos

jQuery Touch enabled, responsive lightbox for displaying images, videos. You can download and customize it your own way.

Here is the quick start guide. Follow below steps.

[sourcecode language=”plain”]
<!– 1. Add latest jQuery and fancybox files –>

<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.6/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.6/dist/jquery.fancybox.min.js"></script>

<!– 2. Create links –>

<a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a>
<a data-fancybox="gallery" href="big_2.jpg"><img src="small_2.jpg"></a>

<!– 3. Have fun! –>

Demo Read More Download

Lightview The jQuery Lightbox

Lightview allows you to easily create the most beautiful overlay windows using the jQuery Javascript library.

By combining support for a wide range of media with gorgeous skins and a user-friendly API, Lightview aims to push the Lightbox concept as far as possible.

Website Demo