花式框在iframe中使用beforeShow函數？

Question

我試圖動態設置我的Fancybox對象的一些值，基於存儲在iframe中的標籤內的信息，這個iframe正在加載。問題是，我似乎只能從內容中獲得CORRECT值（iv嘗試了幾乎每個可能的回調組合）都是afterShow方法。這會導致顯示後重置的寬度和高度的躍變。

 
$('.fancybox').fancybox({ 
      openEffect : 'elastic', 
      closeEffect : 'elastic', 
      autoSize:true, 
      afterShow : function() { 
        var fancy = this; 
        var h = $('.fancybox-iframe').contents().find('html').height(); 
        var w = $('.fancybox-iframe').contents().find('html').width(); 
        fancy.width = w; 
        fancy.height = (h+50); 
      } 
     }); 

afterShow方法之外沒有任何東西給我正確的結果，即使beforeShow（這是我正在做的）。有沒有任何回調/ jquery組合可以在顯示花式框之前做到這一點？謝謝！

Answer 1

你也可以使用beforeShow回調選項，但您可能需要取消所有的轉換（設置nextSpeed和prevSpeed到0）。

轉換速度似乎是使用afterShow回調創建跳躍效果，或者避免使用beforeShow回調獲得正確的值。

您可能還需要更新到fancybox版本v2.0.6。

此外，你也可以簡化你的腳本，而不喜歡使用外部變量：

$(document).ready(function() { 
$("a.fancybox").fancybox({ 
    openEffect : 'elastic', 
    closeEffect : 'elastic', 
    fitToView: false, 
    nextSpeed: 0, //important 
    prevSpeed: 0, //important 
    beforeShow: function(){ 
    // added 50px to avoid scrollbars inside fancybox 
    this.width = ($('.fancybox-iframe').contents().find('html').width())+50; 
    this.height = ($('.fancybox-iframe').contents().find('html').height())+50; 
    } 
}); // fancybox 
}); // ready 

見DEMO here