Question

当我添加此代码时，宽度和高度的设置无效

jQuery(document).ready(function() {
  $('a.iframe').fancybox(); 
});

有什么选择可以解决它？

Answer 1

请查看此处的文档：http://fancybox.net/api

您正在使用内联内容，因此请确保将autoDimensions选项设置为false以及宽度和高度设置。

更新：我成功测试了以下解决方案：

    $('a.fbtag').fancybox({
        autoDimensions: false,
        height: 300,
        width: 400
    });

这假设您要打开的链接的类名是“fbtag”。

Answer 2

Fancy Box width和Height始终因介质类型而异。

如果我们提供5 * 5像素图像 - Fancy Box将显示图像尺寸的尺寸。

要对抗介质尺寸的影响并定义默认宽度＆amp; Fancy Box的高度

试试这个：

$.fancybox.open(collection.toJSON(), {
   afterShow :function(){},
   maxHeight    : 600,
   minWidth : 500           
});

FancyBox宽度最小 - 500像素。

FancyBox高度将与FancyBox数据成比例，最大高度为600像素。

Answer 3

例如

$.fancybox({
    'content':"This will be the content of the fancybox",
    'width':'500',
    'autoDimensions':false,
    'type':'iframe',
    'autoSize':false
});

Answer 4

$(document).ready(function() {
    $(".fancy-ajax").fancybox({
        type:           'ajax',
        autoDimensions: false,
        'autoSize':     false,
        'height':       'auto'
    });
});

以上代码对我有用。但是，我在Twitter Bootstrap中设计。

Answer 5

你可以这样做两种方式

使用iframe

   $(document).ready(function () {
        $(".fancybox").fancybox({
            width:600,
            height:400,
            type: 'iframe',
            href  : 'url_here'
       });
     })

没有iframe

 $(document).ready(function () {
    $(".fancybox").fancybox({
        width:600,
        height:400,
        autoDimensions: false,
   });
 })

fancybox的宽度和高度问题

5 个答案: