Problem loading vimeo in gallery

Page: 1

Author Post
Member
Registered: Jun 2012
Posts: 21
I'm trying to create a mixed media gallery, loading html from hidden divs, and have succeeded with all elements but vimeo. I'm trying to load the video using a named hidden anchor with data-fb-options="type:video" applied on it.

Here's the gallery div:

<div class="floatbox" data-fb-options="group:1 autoStart:true modal:false 
outsideClickCloses:false showClose:false stickyDragResize:false navType:overlay
showItemNumber:false colorTheme:white roundCorners:none autoFitImages:true">
<a href="#slide_1" class="floatbox"></a>
<a href="#slide_2" class="floatbox"></a>
<a href="#slide_3" class="floatbox"></a>
<a href="#slide_4" class="floatbox"></a>
<a href="#slide_5" class="floatbox"></a>
<a href="#slide_7" class="floatbox"></a>
<a href="#slide_8" class="floatbox"></a>
<a href="#slide_9" class="floatbox"></a>
<a href="#slide_10" class="floatbox"></a>
<a href="#slide_11" class="floatbox"></a>
<a href="#slide_12" class="floatbox"></a>
<a href="#slide_13" class="floatbox"></a>
<a href="#slide_14" class="floatbox"></a>
<a href="#slide_15" class="floatbox"></a>
</div>


...and here're the hidden elements:

<img id="slide_1" style="display:none;" src="http://example.com/image1.jpg" />

<a id="slide_2" style="display:none;" href="//vimeo.com/1234567" data-fb-options="type:video"></a>

<img id="slide_3" style="display:none;" src="http://example.com/image2.jpg" />

<table id="slide_4" style="display:none;"><tr><td id="slide_image_landscape"><img src="http://example.com/image3.jpg" /></td></tr><tr></td></tr></table>


The video's shared to everyone and visible to everyone. I'm stumped. :?
Administrator
Registered: Aug 2008
Posts: 3382
I don't really understand what it is you're trying to do here. You're loading a hidden <a> element as the html content of the floatbox. Are you wanting people to click that link after it is loaded in the floatbox? If so, they'll just navigate to the vimeo page when they click that because the link has no floatbox class on it.

I suspect what you want to do is to simply show the video in the floatbox instead of showing the link to the video. If so, instead of...
<a href="#slide_2" class="floatbox"></a>
... you would want...
<a href="//vimeo.com/1234567"></a>

The href points to what you want to show in the floatbox. You don't need the floatbox class on all those links because that will be inherited from the containing div that has the floatbox class on it. 'video' is the default type for vimeo links.
Member
Registered: Jun 2012
Posts: 21
I made the blackbox assumption that fb used the anchors as redirects to load elements from elsewhere instead of being able mix direct elements with imported elements. A means of automating links that otherwise would be manually clicked.

Does this make sense? After your explanation, well, probably not. ;) So, thanks again for taking the time to respond, and I should be able to take it from here.

Floatbox rocks, btw. :D

Page: 1