0

我试图根据存储在 iframe 内的标签中的信息动态设置我的 Fancybox 对象的一些值,该 iframe 正在加载该标签。问题是,我似乎唯一一次可以从内容中获取正确的值(我几乎尝试了所有可能的回调组合)是在 afterShow 方法上。这会导致显示后重置的宽度和高度的跳跃过渡。

$('.fancybox').fancybox({
            openEffect : '弹性',
            closeEffect : '弹性',
            自动尺寸:真,
            演出后:函数(){
                    变种花哨=这个;
                    var h = $('.fancybox-iframe').contents().find('html').height();
                    var w = $('.fancybox-iframe').contents().find('html').width();
                    花式.宽度 = w;
                    花式.高度 = (h+50);
            }
        });

afterShow 方法之外的任何东西都没有给我正确的结果,即使是 beforeShow(这就是我想要的)。在显示花哨的盒子之前,是否有任何回调/jquery 组合可以实现这一点?谢谢!

4

1 回答 1

12

您也可以使用beforeShow回调选项,但您可能需要取消所有转换(设置nextSpeedprevSpeed0)。

过渡速度似乎是使用回调创建跳跃效果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

在此处查看演示

于 2012-05-27T19:06:23.633 回答