Keith
Keith

Reputation: 4147

FancyBox - Swap out image on click

When clicking on a thumbnail, FancyBox enlarges that image but what I'd like to do is replace the image being enlarged to another image.

<map>
  <area shape="poly" coords="453,862,477,862,478,899,453,900" href="/Images/main.jpg" alt="333" />
</map

$('area').fancybox({
  beforeLoad: function(instance){
   //change href to something like "/Images/main_333.jpg"
   // the idea is to grab the alt tab number and then add it to the href string to get the correct image
  }
});

Upvotes: 0

Views: 286

Answers (1)

Janis
Janis

Reputation: 8769

Here is an example of how to change URL:

$('[data-fancybox="images"]').fancybox({
  beforeLoad : function(instance, current) {
    current.src = 'https://loremly.com/640x480/';
  }
});

Upvotes: 1

Related Questions