beforeShow 함수에서 iframe이있는 멋진 상자 작업이 가능합니까?

Question

임 동적으로 멋진 상자를로드하는 iframe이 내부 태그에 저장된 정보를 기반으로 내 Fancybox 개체의 일부 값을 설정하려고합니다. 문제는, 내가 올바른 값을 얻는 것처럼 보일 수있는 유일한 시간 (iv는 가능한 모든 콜백 콤보를 시도했습니다)은 afterShow 메서드에 있습니다. 이것은 너비와 높이의 급격한 변화를 야기하며,이 폭과 높이는 표시 후에 재설정됩니다. 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); 
      } 
     }); 

아무것도 나에게 올바른 결과, (I가 가고 무엇인가)도 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