Img link + caption html data

kamillion commented 13 years ago

captions made of html data don't work while interrelated with images set as links. How make links to work properly with such advanced captions? Thanks in advance for help!

docbrandes commented 13 years ago

Totally having this same issue. Captions will not display when images are enclosed in anchor tags. This seems to be a very basic function that is currently a bug with the Orbit slider. Please fix/update this otherwise excellent plugin!

geopii commented 13 years ago

I wanted to have a caption on an image and have a link on the image too. You can mostly achieve the affect by putting the data-caption into the tag:

<a href="..." data-caption="#htmlCaption"><img .../></a>

then you'll have a clickable image but not a clickable caption unless you add the appropriate html.

mkelly12 commented 13 years ago

If I understand this issue correctly, then geopii is correct. The data-caption attribute needs to be on a slide tag (the tags directly inside the orbit element).

<div id="horizontalPushAnimation" class="demo-orbit"> 
    <div class="content" style="">
        <h1>Orbit does content now.</h1>
        <h3>Highlight me...I'm text.</h3>
    </div>
    <a href="" data-caption="#htmlCaption"><img src="dummy-images/overflow.jpg" /></a>
    <img src="dummy-images/captions.jpg" />
    <img src="dummy-images/features.jpg"  />
</div>
<!-- Captions for Orbit -->
<span class="orbit-caption" id="htmlCaption">
    <strong>I'm A Badass Caption:</strong> I can haz 
    <a href="#">links</a>, <em>style</em> or anything that is valid markup :)
</span>

zurb / orbit

Img link + caption html data #13