调整Fancybox iframe覆盖宽度和高度的问题

我正在使用Fancybox创建覆盖iframe的一切工作，但我似乎无法改变宽度/高度的值。我使用的fancybox-1.2.6和jquery1.2.6调整Fancybox iframe覆盖宽度和高度的问题

$(document).ready(function() { 

     $("a.iframe").fancybox({ 
    'width' : '75%', 
    'height' : '75%', 
    'autoScale' : false, 
    'transitionIn' : 'none', 
    'transitionOut' : 'none', 
    'type' : 'iframe' 
}); 
    });

和

<a class="iframe" id="iframe" title="Sample title" href="http://google.com/">iframe</a>

来源

2011-05-18 Michael

你必须直接改变它的CSS，因为未启用的fancybox jQuery的实际的一部分。

$("#fancybox").css({'width': '500px', 'height': '500px'});

有这样或这样的事情，

jQuery(document).ready(function() { 
$.fancybox(
    { 
     'autoDimensions' : false, 
     'width'    : 350, 
     'height'   : 'auto', 
     'transitionIn'  : 'none', 
     'transitionOut'  : 'none' 
    } 
); 
});

来源

2011-05-18 16:57:03 Mertis

谢谢。我会在哪里把它放在我的代码中？ – Michael 2011-05-18 17:12:13

增加了另一种方式来做到这一点 – Mertis 2011-05-18 17:26:20

也我看到你有$（“a.iframe”）。fancybox（{ 为什么在那里“a”你不需要它只是去$（“。iframe”） – Mertis 2011-05-18 17:28:56

这在过去为我工作。我不得不设置高度和宽度。

$(document).ready(function() {   
    $("a.iframe").fancybox({ 
        'autoDimensions' : false, 
        'width'    : 600, 
        'height'   : 150, 
        'transitionIn'  : 'elastic', 
        'transitionOut'  : 'elastic', 
        'type'    : 'iframe' 

       }); 
    });

来源

2011-05-18 19:53:16

再次，这是行不通的。是否因为我使用1.2.6？ – Michael 2011-05-18 20:15:20

是的。更新到最新版本Fancybox 1.3.4。我'我只是用jquery-1.5.2.min.js检查了这段代码，它确实有效。确保你正在运行最新的jquery和fancybox。 – 2011-05-18 22:18:01

我加入了宽度和高度属性的链接标签这样的解决了这个问题：

<a id="various3" href="action.html" width="60%" height="60%">Iframe</a>

你的fancybox代码：

$("#popup").fancybox({ 
    'autoScale'  : false, 
    'width'   : $("a#popup").attr("width"), 
    'height'  : $("a#popup").attr("height"), 
    'transitionIn' : 'elastic', 
    'transitionOut' : 'elastic', 
    'type'   : 'iframe' 
});

来源

2011-12-16 09:56:51 JAY

请不要使用Firefox 。它不起作用，他们没有使高度兼容，而是尝试使用chrome！（！最新的Firefox今天）如果是支持的浏览器，删除对PX的报价，把报价％，如：

'width': 400; //400 pixels; 
'width': '75%'; //75% of the screen 
//height do not work on Mozilla Firefox (today!)

来源

2012-11-21 11:41:26 vimxts

只是试试这个

$(".fancyboxiframe").fancybox({ 
     fitToView:false, 
     autoSize:false, 
     'width':parseInt($(window).width() * 0.7), 
     'height':parseInt($(window).height() * 0.55), 
     'autoScale':true, 
     'type': 'iframe' 
    });

来源

2013-03-12 06:34:11

尝试使用：

'maxHeight' : 380,

来源

2013-03-22 07:39:52 jok3r

下面是如何手动在一个固定大小的fancybox打开一个iframe

$.fancybox.open({ 
    'href': 'mypage.html', 
    'type': 'iframe', 
    'autoSize': false, 
    'width': 800, 
    'height': 800 
});

来源

2013-04-11 10:00:39

（这是autoSize：false，这是关键的一点） – 2014-07-23 10:19:21

调整Fancybox iframe覆盖宽度和高度的问题

回答

相关问题