Fancybox在Internet Explorer中使用iframe时出现问题

Question

Fancybox在Internet Explorer中使用iframe时出现问题

javascriptjqueryhtmlcssfancybox

5

我在使用Internet Explorer时遇到了一个问题。iframe的大小不正确，显示在页面的左上角而不是中间。

在Firefox和Chrome中，一切都正常。

我尝试了很多方法，但都找不到解决方案:(

请帮帮我。

以下是屏幕截图：

这是我的代码：

<head>
    <script type=\"text/javascript\" src=\"http://www.$domain/scripts/jquery-1.8.2.min.js\"></script>
    <script type=\"text/javascript\" src=\"http://www.$domain/scripts/jquery.fancybox.js?v=2.1.1\"></script>
    <link rel=\"stylesheet\" type=\"text/css\" href=\"http://www.$domain/scripts/jquery.fancybox.css?v=2.1.1\" media=\"screen\" />

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

            $('.fancybox').click(function() {
                $.fancybox.open({
                    href : 'iframe.html',
                    type : 'iframe',
                    padding : 5,
                    autoScale : false
                });
            });

    $(\".contactbox\").fancybox({

        openEffect : 'elastic',
        openSpeed  : 150,
        closeEffect : 'elastic',
        closeSpeed  : 150,
        closeClick : true,
        'overlayShow'    :    false,
        href : 'contact.php',
        type : 'iframe',
        padding : 5,
        autoScale : true,
        scrolling : 'no'
        frameWidth : 430,
        frameHeight : 380
    });

        });
    </script>

</head>
<body background=\"$background\" id=\"top\">

<a class=\"contactbox\" href=\"http://$domain/contact.php\">Iframe</a>

- 456543646346

1

这段代码中有很多 \"，它们不应该出现在那里 - 你想要转义什么？ - Oleg

我不确定它是否真的有用，但 autoScale: false 绝对引起了我的注意。 - ACJ

哇，6个赞...对于一个正在学习的人来说不错。但我仍然建议你回到基础：http://www.w3schools.com/html/default.asp ... 特别注意文档结构，并记住所有内容（我的意思是）都要么在<head>部分中，要么在<body>部分中。你的许多“错误”或不一致之处都是由于你的“不太好”的HTML结构以及某些声明在上述部分之外造成的。另外，请努力阅读fancybox文档，你使用的一些选项已经过时了。祝你好运。 - JFK

顺便提一句，你要么使用 $('.fancybox').fancybox() 或者 $('.fancybox').click(function(){$.fancybox.open({// opts })}) 中的一个，而不是两个都用，否则就会出现“意外”的 fancybox 行为。 - JFK

1

顺便说一句，你只需要一个jQuery实例（最好是最新版本）。你正在加载3个不同版本的jQuery（v1.3.2、v1.4.4和v1.8.2）。 - JFK

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Oleg · Accepted Answer

你的页面以怪异模式呈现，因为你没有正确的HTML DTD声明。

F12截图

如果你打开IE开发者工具栏（F12），你会看到它在标准模式下正确呈现。