停止，在fancybox上開始超大尺寸

Question

我正在嘗試使用超大號的和花式的盒子。 我在supersized.js中添加了一些html，以將帶有fancybox的圖像顯示在每張幻燈片中的默認標題框中，即div id = slidecaption。

所有的作品，但我試圖停止並重新啟動fancybox時打開/關閉超大幻燈片。

這段代碼可以很好地停止幻燈片播放：

<script type="text/javascript">
jQuery(document).ready(function(){
$('#slidecaption').click(function() {
api.playToggle();
});
});
</script>

---

但是當我關閉fancybox時，我找不到重新開始幻燈片放映的方法。 有div class = fancybox-overlay，但是我重復上面的代碼：

<script type="text/javascript">
jQuery(document).ready(function(){
$('.fancybox-overlay').click(function() {
api.playToggle();
});
});
</script>

.....沒有任何效果。

你建議吃些容易的東西嗎？

非常感謝你

Answer 1

使用此鏈接（ http://jsfiddle.net/RyTcS/ ）希望它對您有幫助。

 $(".fancybox")
 .attr('rel', 'gallery')
.fancybox({
    padding    : 0,
    margin     : 5,
    nextEffect : 'fade',
    prevEffect : 'none',
    afterLoad  : function () {
        $.extend(this, {
            aspectRatio : false,
            type    : 'html',
            width   : '100%',
            height  : '100%',
            content : '<div class="fancybox-image" style="background-image:url(' + this.href + '); background-size: cover; background-position:50% 50%;background-repeat:no-repeat;height:100%;width:100%;" /></div>'
        });
     }
  });

Answer 2

嘗試在fancybox自定義初始化中使用fancybox回調，例如：

$(".fancybox").fancybox({
    beforeLoad: function () {
        api.playToggle(); // stop / pause
    },
    afterClose: function () {
        api.playToggle(); // restart
    }
});