Menu icon Foundation
HTML captions in Clearing Lightbox, Hyperlink doesn't work

Hi there.

I did write like this, clearing light box works well.
but, only hyperlink in each captions doesn't work.
text color is changed, not transition to link page when I click there.

Am I misunderstood?

<li class="large-2 medium-4 small-6 columns"><a href="/largephoto/src"><img data-caption="Photo by Joe, <a href='/originalurl/src'>photo title</a>" class="th" src="/th/src"></a></li>
            

         

clearingcaption

Hi there.

I did write like this, clearing light box works well.
but, only hyperlink in each captions doesn't work.
text color is changed, not transition to link page when I click there.

Am I misunderstood?

<li class="large-2 medium-4 small-6 columns"><a href="/largephoto/src"><img data-caption="Photo by Joe, <a href='/originalurl/src'>photo title</a>" class="th" src="/th/src"></a></li>
            

         
Damian over 4 years ago

Hi,

I've stumbled upon the same problem, I even tried it on the demo page to see if it wasn't my fault somewhere - clicking on links inside Clearing captions doesn't seem to work.

Oddly enough, 'click' events and such are called normally on these links, but I can't use a workaround with callbacks like this in my project.

P K over 4 years ago

Is there solution for this one?

Carol Skelly over 4 years ago

I don't think links are supported in captions

Andrew Leonard almost 4 years ago

Hey,

Just use the Clearing event handlers to add a click listener to the tag and give it a class -

 <script>
$(document.body).on("opened.fndtn.clearing", function(event) {
$( ".test" ).click(function() {
  document.location.href=$(this).attr("href");
});
});
</script>