Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Ekko Lightbox for Bootstrap and WordPress Example jQuery
// Ekko lightbox attribute data-toggle to gallery links
$('.gallery-item').find('a').attr('data-toggle', 'lightbox');
$('.gallery-item').find('a').attr('data-gallery', 'gallery');
$('.gallery-item').find('a').attr('data-type', 'image');
// enable ekko lightbox on page
$(document).on('click', '[data-toggle="lightbox"]', function(event) {
alwaysShowClose: true,
// Replace gallery image with background imag in a tag for apect ratio
$('.gallery-icon a').each(function(){
var src = $(this).children('img').attr('src');
$(this).css('background-image', 'url(' + src + '');
// Add download image button to each gallery image
$('.gallery-icon a').each(function(){
var title = '';
var savebutton = '';
var src = '';
src = $(this).children('img').attr('src');
title = $(this).children('img').attr('title');
savebutton += '<div class="save-wrapper"><a href="'+ src +'" download="'+ title +'" type="button" class="image-save-button">Download</a></div>';
// Show download button on hover of image
$('.gallery-icon a').hover(function(){
}, function(){
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment