Google chrome Fancybox 2在Chrome中呈现怪异，但在Firefox和Opera中效果良好_Google Chrome_Fancybox

Google chrome Fancybox 2在Chrome中呈现怪异，但在Firefox和Opera中效果良好

google-chrome

Google chrome Fancybox 2在Chrome中呈现怪异，但在Firefox和Opera中效果良好,google-chrome,fancybox,Google Chrome,Fancybox,我花了半天的时间让fancybox 2.1.5在Chrome上运行，在Ubuntu Linux 14.04下有46.0.2490.86版（64位）。 Firefox和Opera正确地渲染了iframe，但在Chrome中我得到了奇怪的结果。帧大小小于包含帧的div的大小。实际大小为800x600，但我得到的iframe大小约为300x150。它也不是集中在屏幕上我试着从CDN和https加载jquery，这没关系。我还试图删除所有css，但没有成功。 JS控制台中也没有错误 --更新--

我花了半天的时间让fancybox 2.1.5在Chrome上运行，在Ubuntu Linux 14.04下有46.0.2490.86版（64位）。 Firefox和Opera正确地渲染了iframe，但在Chrome中我得到了奇怪的结果。帧大小小于包含帧的div的大小。实际大小为800x600，但我得到的iframe大小约为300x150。它也不是集中在屏幕上

我试着从CDN和https加载jquery，这没关系。我还试图删除所有css，但没有成功。 JS控制台中也没有错误

--更新--

正如您所见，我尝试了不同的变体，包括可选的fancybox内容，我尝试了不同版本的jquery，我将内容从body部分的底部移动到head，我删除了所有fancybox参数，我还尝试了仅使用width&height属性。结果是FF和Opera都能工作，但Chrome并非在所有情况下都能工作。（

autoCenter

，

autoScale

等参数稍微改变了行为，但这并不重要

<head>
<link rel="stylesheet" href="{{ url_for('static', filename='fancybox/jquery.fancybox.css') }}" type="text/css" media="screen" />
<link rel="stylesheet" href="{{ url_for('static', filename='fancybox/helpers/jquery.fancybox-buttons.css') }}" type="text/css" media="screen" />
<link rel="stylesheet" href="{{ url_for('static', filename='fancybox/helpers/jquery.fancybox-thumbs.css') }}" type="text/css" media="screen" />

<!--<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>-->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!--<script type="text/javascript" src="{{ url_for('static', filename='js/lib/jquery-1.11.1.min.js') }}"></script>-->
<script type="text/javascript" src="{{ url_for('static', filename='js/lib/jquery.mousewheel-3.0.6.pack.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='js/lib/alertify.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/lib/jquery.slides.min.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='fancybox/jquery.fancybox.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='fancybox/helpers/jquery.fancybox-buttons.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='fancybox/helpers/jquery.fancybox-thumbs.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='fancybox/helpers/jquery.fancybox-media.js') }}"></script>
    <script>
    $(function() {
        $(".signup-form").fancybox({
            autoSize: false,
            fitToView: false,
            width: 813,
            height : 603,
            minWidth: 813,
            minHeight : 603,
            autoCenter: false,
            autoScale: false,
            autoDimensions: false,
            type: "iframe"
//                afterLoad: function () {
//                    this.width = $(this.element).data("width");
//                    this.height = $(this.element).data("height");
//                }
        });
    }
    </script>
</head>

<body>
  ...
<!-- trigger -->
    <div class="sign-up"><a class="signup-form" data-fancybox-type="iframe" href="/signup" id="global-signup-link"><span>Sign up</span></a></div>
  ...
</body>


$（函数（）{
$（“.signup form”）.fancybox({
自动调整大小：false，
菲托维：错，
宽度：813，
身高：603，
最小宽度：813，
身高：603，
自动中心：false，
自动缩放：错误，
自动标注：false，
类型：“iframe”
//后加载：函数（）{
//this.width=$（this.element）.data（“width”）；
//this.height=$（this.element）.data（“height”）；
//                }
});
}
...
...

提前准备好

您的代码在哪里？您好，请再次告诉我，这个问题出了什么问题？