1

我到处寻找这个问题。当用户点击一个链接时，它会加载一个带有 iframe 的fancybox。然而，出于某种原因，iframe 的尺寸很小。我尝试过调整宽度、高度、minWidth 和 minHeight 设置，但没有区别。

这是标题中的相关代码（我链接了所有 Fancybox 脚本）：

 <script type="text/javascript">
$(document).ready(function() {
    $(".fancybox").fancybox();
});
</script>

<script type="text/javascript">
    $(document).ready(function() {
     $("iframe").fancybox({
        'width': 600,
        'height': 250,
        'transitionIn': 'elastic',
        'transitionOut': 'elastic',
        'type': 'iframe'
    });
});
</script>

和html：

 <a class="fancybox fancybox.iframe"  href="iframe.html">link here </a>

有任何想法吗？

4

2 回答 2

3

如果你有这个 html

<a class="fancybox fancybox.iframe"  href="iframe.html">link here </a>

那么你绑定到 fancybox 的选择器是.fancybox.

fancybox.iframe另一方面，它是2.x 版本中引入的一个特殊类，它指示fancybox 需要打开的内容，您不需要对它做任何特定的事情，所以：type

<script type="text/javascript">
    $(document).ready(function() {
     $(".fancybox").fancybox({
        'width': 600,
        'height': 250,
        'transitionIn': 'elastic', // this option is for v1.3.4
        'transitionOut': 'elastic', // this option is for v1.3.4
        // if using v2.x AND set class fancybox.iframe, you may not need this
        'type': 'iframe',
        // if you want your iframe always will be 600x250 regardless the viewport size
        'fitToView' : false  // use autoScale for v1.3.4
    });
});
</script>

这应该够了吧。

请记住，如果您使用的是 fancybox v2.x，API 选项是新的，并且与以前的版本不兼容。查看http://fancyapps.com/fancybox/#docs以获取该版本的选项、方法和回调的完整列表。

于 2013-03-28T15:20:01.107 回答
0

尝试设置autoScale=false

朱利安

于 2013-03-28T13:30:00.850 回答