search

fancyapps / fancybox

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

Lorem Pixel Integration? #1170

Closed codedcontainer closed 7 years ago

codedcontainer commented 7 years ago

Is it possible to add images that are automatically generated with FancyBox? I have several images that do not include an extension (.jpg, .png, .gif, etc) which I am generating from lorempixel.com. Below is an example of images that do not display on click: 

<a href="http://lorempixel.com/250/250/technics" class="fancybox" rel="group">
<img src="http://lorempixel.com/250/250/technics" height="50" width="50" alt="tech">
</a>
  function setFancyBox(){
          $('window').ready(function(){
               $('.fancybox').fancybox(); 

          }); 
      }
      setFancyBox();
fancyapps commented 7 years ago

You have to specify content type as "image" and you can do it two ways: 1) set as parameter and mark all items as images:

$(".selector").fancybox({'type' : 'image'});

2) or add "data-fancybox-type" attribute to each link individually, like:

<a href="http://lorempixel.com/250/250/technics" class="fancybox" data-fancybox-type="image" rel="group">

fancyapps commented 7 years ago

btw, why do you have $('window').ready(..) it should be $(document).ready(..)