Question

我正在使用WordPress的fancyBox插件，我有一个问题。当我调整窗口大小时，弹出窗口不会调整大小，但如果我在调整窗口大小的情况下浏览图像，则会正确调整弹出窗口的大小。我试图像这样做一个额外的回调：

window.onresize = function(event) {
   $.fancybox.resize();
}

但它显示错误：$ is not defined。

Answer 1

尝试使用jQuery代替$

window.onresize = function(event) {
   jQuery.fancybox.resize();
}

Answer 2

您应该使用$(window).resize()而不是window.onresize，因为使用本机事件处理程序可能会干扰或受到jQuery的干扰。如果你有jQuery，那就使用jQuery方法。

我不知道你有什么版本的FancyBox ^$，但如果你是最新的（2.1.0），你可以通过{{3到构造函数，它会为你做的：

autoDimensions： true
对于内联视图和ajax视图，请将视图大小调整为元素收到了。确保它有尺寸否则会这样给出意想不到的结果

$(document).ready(function() {
    $("a").fancybox({
        openEffect: 'none',
        closeEffect: 'none',
        width: 400,
        height: 300,
        autoDimensions: true
    });
});

autoDimensions: true，Demo

您还可以使用以下一项或多项：

 Method                 Description
----------------------------------------------------------------------------
 $.fancybox.resize  // Auto-resizes FancyBox height to match content height
 $.fancybox.center  // Centers FancyBox in viewport

_{^$根据Source，$.fancybox.resize()适用于v1.3及以下版本。但是，它实际上是在最新的（2012年9月19日）文档中引用的，在{em>公共方法下的this answer from 2010处。}

Answer 3

也许试试这个......

JQuery(document).ready(function() {

  window.onresize = function(event) {
    JQuery('.fancybox').resize();
  }

)};

.fancy是正确的类吗？

WordPress上的fancyBox调整窗口大小调整大小

3 个答案: