Вопрос по iframe, fancybox, jquery, fancybox-2 – модная работа с iframes в beforeShow функции?

0

Я пытаюсь динамически установить некоторые значения моего объекта Fancybox на основе информации, хранящейся в тегах внутри iframe, который загружает модный блок. проблема в том, что единственный раз, когда я могу получить ПРАВИЛЬНЫЕ значения из содержимого (я попробовал практически все возможные комбинации обратного вызова), это метод 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 (именно к этому я и стремлюсь). Есть ли какая-нибудь комбинация callback / jquery, которая может достичь этого, прежде чем показывать модную коробку? Спасибо!

Ваш Ответ

1   ответ
12

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

УвидетьДЕМО здесь

+1 @JFK и спасибо за добавление демо
спасибо, очень очень четкий и исчерпывающий ответ. работает отлично, очень ценю это roozbubu

Похожие вопросы