2

我有一种情况，我有 BackboneJS (0.9.2) 和 RequireJS (2.1.3) 并且需要使用 Fancybox 打开一些内联隐藏内容（从下划线模板呈现）：

<div id="inlineContent" style="display: none">
    <div class="brand-images">
        <img class="brand-image" src="/img/brandImage.png" alt="" />
        <img class="designer-image" src="/img/designer.jpg" alt="" />
        <div class="external button"><a href="<%= designer.get("link") %>" data-designer="<%= designerId.substr(2, designerId.length) %>">Shop the full collection</a><span></span></div>
    </div>
    <div class="details">
        <p><%= designer.get("bio") %></p>
        <p class="more-bio"><%= designer.get("bioMore") %></p>
    </div>
</div>

我尝试了多种方式将fancybox附加到元素上，最简单的是在View.render（也使用了View.events）：

$(this.el).html(  _.template( detailsDesignerTemplate, data )).appendTo(that.pageElement);
$('.read-more').fancybox({
    padding: 0,
    height: 'auto',
    width: 970,
    autoSize: false,
    title: '<h1>Title</h1>'
});

除了 IE7（不支持 IE6，耶！）之外的所有内容都可以。IE7 什么都不做（虽然有趣的是它确实调用了“beforeLoad”回调）；

此外，有趣的是，它适用于 iFramed 内容。

4

1 回答 1

0

fancybox 使用的容器 #fancybox-content 刚刚设置到您的视图中查看 el:$('#fancybox-content') 并调用 $.fancybox(this.$el.html(),{options})

于 2013-01-05T20:01:03.410 回答