谷歌地图不在fancybox中心

Question

谷歌地图不在fancybox中心

car*_*mba 2 jquery google-maps fancybox fancybox-2

我正在寻找和尝试一整天,但找不到一个正确的解决方案来解决这个问题.我需要居中的部分总是在FF和IE的左上角,Safari似乎更左下角...

这是您尝试,复制,粘贴和点击所需的所有代码...

大屏幕很高兴看到问题在小屏幕上看起来不好看

感谢帮助

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="http://fancyapps.com/fancybox/source/jquery.fancybox.pack.js?v=2.1.4"></script>
<link rel="stylesheet" type="text/css" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css?v=2.1.4" media="screen" />
<script type="text/javascript">
    $(document).ready(function() {
        $(".google_iframe").fancybox({
            'width'             : '75%',
            'height'            : '75%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe'
        });
    });
</script>
</head>
<body>
<a class="google_iframe" href="https://maps.google.com/maps/ms?ie=UTF8&amp;msa=0&amp;msid=202414688179067925321.0004d62815a849d23c081&amp;t=h&amp;ll=43.36373,16.508332&amp;spn=1.617251,3.364563&amp;output=embed">
    click here for fancy
</a>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

的jsfiddle

Answer 1

JFK*_*JFK 7

当您尝试预加载fancybox时,似乎会创建该问题iframe(默认值为true).作为解决方法,只需iframe在您的fancybox自定义脚本中禁用预加载,例如:

$(document).ready(function () {
    $('.google_iframe').fancybox({
        // 'autoScale'    : false, // not valid in v2.x, use autoSize instead
        // 'transitionIn' : 'none', // not valid in v2.x, use openEffect instead
        // 'transitionOut': 'none', // not valid in v2.x, use closeEffect instead
        width      : '75%',
        height     : '75%',
        autoSize   : false,
        openEffect : 'none',
        closeEffect: 'none',
        type       : "iframe",
        iframe     : {
           preload : false // this will prevent to place map off center
        }
    });
});

Run Code Online (Sandbox Code Playgroud)

... 注意我注释了v1.3.4中某些在v2.x中无效的API选项

请参阅JSFIDDLE ...或整页请参阅http://jsfiddle.net/Sy8F8/show/lite/,然后您可以将其与整页(不居中)jsfiddle进行比较

归档时间：	13 年前
查看次数：	3168 次
最近记录：	13 年前