Giving Caption in zurb orbit plugin for slideshow with haml

Question

I am using orbit for slideshow requirements, however I am not able to add captions.

The documentation says this :-

<div id="featured"> 
     <img src="overflow.jpg" alt="Overflow: Hidden No More" />
     <img src="captions.jpg"  alt="HTML Captions" data-caption="#htmlCaption" />
     <img src="features.jpg" alt="and more features" />
</div>
<!-- Captions for Orbit -->
<span class="orbit-caption" id="htmlCaption">I'm A Badass Caption</span>

I am using haml and doing something like this :-

.container
    .row
        .two.columns
            =render "left_navigation"
        .ten.columns.destination_tabs
            .contianer
                .row
                    .ten.columns
                        %h3 Featured Destination
                        %hr
                        -if @preferred.blank?
                            %h5 No Featured destinations currently
                        -else
                            #featured
                                -@preferred.each do |destination|
                                    -destination.destination_photos.each do |photo|
                                        =image_tag(photo.picture.thumb_large.url, :alt =>"html captions", :data-caption => "#htmlCaption")

.orbit-caption#htmlCaption
    ="sfsdf"

This obviously gives error because I cannot give a syntax like :data-caption I tried lot of stuff but couldn't get it right yet can anyone help?

Answer 1

You can use arbitrary strings as symbols by simply quoting them:

:"data-caption" => "#htmlCaption" #note the quotes around data-caption