fancyapps / fancybox

jQuery lightbox script for displaying images, videos and more. Touch enabled, responsive and fully customizable.
http://fancyapps.com/
7.29k stars 1.79k forks source link

Launching fancybox slideshow with a link #2631

Closed stathimexas closed 2 years ago

stathimexas commented 2 years ago

I create my slideshow programmatically and then I want to launch it with a link by adding #gallery to the url. If the slideshow has one image, the code that must be added to the url is #gallery If the slideshow has more than one images, the code that must be added to the url is #gallery-1 I do not have access to the data to calculate this however. The problem: if I add #gallery-1 to a slideshow with only one image, I cannot get out of the slideshow unless I press escape or click the X button 3-4 times very fast. If I add #gallery to a slideshow with more than one images, the slideshow does not launch. Is there a default value or other way that I can use to do this?

stathimexas commented 2 years ago

I resolved the issue like this using JS. My issue was that I had two consecative processes creating slideshows. If you have a better solution, such as a default value for #gallery, please tell.

function get_slideshow_link($some_content) {
$case1='<div id="one-image"   style="display:none;">'.<a href="'.current_url().'#gallery'"  >click me</a></div>';
$case2='<div id="two-images"  style="display:none;">'.<a href="'.current_url().'#gallery-1"'>click me</a></div>';
$slides=create_slides($some_content);
$slides=$case1.$case2.implode(' '.$slides);

if (count($slides)==0) {
   $div1='';
   $div2='';
   }
if (count($slides)==1) {
   $div1='<script>document.getElementById("one-image").style.display="inline-block";</script>';
   $div2='<script>document.getElementById("two-images").style.display="none";</script>';
   }
if (count($slides)>1) {
   $div1='<script>document.getElementById("one-image").style.display="none";</script>';
   $div2='<script>document.getElementById("two-images").style.display="inline-block";</script>';
   }

$slideshow_link=$slides.$div1.$div2;
return $slideshow_link;
}
fancyapps commented 2 years ago

Hi,

If you wish to start Fancybox from another link, you have to use data-fancybox-trigger attribute. See this demo - https://fancyapps.com/playground/1yY