Closed gunjanpatel closed 7 years ago
what's the bug here?
If you want to open a gallery from another element then programmatically call it http://ashleydw.github.io/lightbox/#programatically-call
I hope you have checked link I provided and tried to click on image. Yes, I know programatically-call but that will also include image which I clicked into gallery. I don't want that image included in gallery.
In other words, I want to open gallery slideshow on click of image and that image should not be in the slideshow. In above example I need all images having .thumbnail
class into gallery slideshow when I click on #main-image
.
Assign the other image a click event and within the handler trigger the click of the gallery.
Thanks @ashleydw it was tricky. It worked now even without using trigger
.
I have updated code in above link and it works now even with ekkoLightbox
method.
$(document).on('click', '#main-image', function(event) {
event.preventDefault();
// Only trigger first image click to avoid multiple triggers
$('.thumbnail:first').ekkoLightbox();
});
hi @ashleydw and thanks for your work on this project. Quick question, is this the preferable method to opening a gallery from an "unrelated" link? My scenario is that I want to open the gallery from a "open gallery" button that doesn't have an image.
Thanks in advance. Ignacio
I am currently doing it like this but I wondere if I am not missing anything obvious... I am adding custom data- attributes and checking for those JS
$(document).on('click', '[data-toggle="lightbox"]', function(event) {
event.preventDefault();
var $the_button = $(this);
if ($the_button.data('behaviour') == 'open-gallery') {
var target = $the_button.data('gallery-target');
$('#'+target + ' div:first-child').ekkoLightbox();
} else {
$(this).ekkoLightbox();
}
});
Markup
<a href="#g-test" class="single-button" target="_self" data-toggle="lightbox" data-type="image" data-behaviour="open-gallery" data-gallery-target="g-test">open gallery</a>
<div class="hidden-galleries">
<div id="g-test">
<div data-toggle="lightbox" data-gallery="g-test" data-remote="./television.jpg" data-title="Galería test"></div>
<div data-toggle="lightbox" data-gallery="g-test" data-remote="./teatro.jpg" data-title="Galería test"></div>
<div data-toggle="lightbox" data-gallery="g-test" data-remote="./radio.jpg" data-title="Galería test"></div>
</div>
</div>
Trying to open gallery by click another image but I don't want this particular image to be in lightbox so using following code.
and HTML code for that,
If you really do think you have a bug, please: