Fancybox 根据屏幕尺寸错误地改变高度

Question

我有一个以像素为单位设置高度和宽度的花式框。代码是：

$("#join").fancybox({
    overlayOpacity      : 0.8, // Set opacity to 0.8
    overlayColor        : "#000000", // Set color to Black
    padding         : 0,
    'width'         : 305,
    'height'        : 677,
    'transitionIn'      : 'elastic',
    'transitionOut'     : 'elastic',
    'type'          : 'iframe',
});

fancybox 的高度和宽度与fancybox 内的内容完全匹配，因此--应该-- 没有垂直或水平滚动条。

当我在台式计算机上打开 fancybox 时，一切正常——没有滚动条。但是，当我在笔记本电脑（较小的屏幕尺寸）上打开fancybox 时，fancybox 有一个垂直滚动条，需要我向下滚动才能查看fancybox 的其余内容。宽度很好——没有出现水平滚动条。即使高度设置为 677 像素，它在我的笔记本电脑上似乎显示得更小。

要查看实际发生的情况，请访问 www.mytrailapp.com 并单击加入按钮（右上角）。花式框弹出窗口应该没有滚动条，但在我的笔记本电脑上似乎有一个垂直滚动条。

任何帮助表示赞赏。

Answer 1

将autoScale: false, 行添加到您的jQuery 代码中：

$("#join").fancybox({
autoScale : false,
overlayOpacity      : 0.8, // Set opacity to 0.8
overlayColor        : "#000000", // Set color to Black
padding         : 0,
'width'         : 305,
'height'        : 677,
'transitionIn'      : 'elastic',
'transitionOut'     : 'elastic',
'type'          : 'iframe',
});

我认为如果屏幕比内容短，这就是你想要的行为。

Answer 2

如果使用fancybox v1.3.4 将autoScale 设置为false：

$("#join").fancybox({
    autoScale: false, 
    // your other API options
});

如果使用fancybox v2.x 将fitToView 设置为false：

$("#join").fancybox({
    fitToView : false,
    // your other API options
});