Question

嗨，我需要一些帮助，在页面加载时打开fancybox灯箱。

我想要实现的目标是在页面加载时打开一个灯箱，并在灯箱内使用html页面，例如iframe。

我的js电话是：

jQuery(document).ready(function() {
    $.fancybox(

        {
      'autoDimensions'  : false,
      'width'               : 350,
      'height'              : 650,
      'transitionIn'        : 'none',
      'transitionOut'       : 'none',
      'type': 'iframe',
      'href': 'http://www.meandhimclients.co.uk/beachhorizon/bh_wordpressdev/wp-content/themes/beach%20horizon/lighttest.html'
        }
    );
});

灯箱确实加载所以js没问题，但是我的html页面没有在窗口内加载。任何帮助表示赞赏。

THX 罗布

Answer 1

我不知道这是否是你问题的原因，但你有两次叫fancybox：一旦缩小，一次完整来源

<!-- HERE -->
<script type="text/javascript" src="http://www.meandhimclients.co.uk/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="http://www.meandhimclients.co.uk/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/jquery.easing-1.3.pack.js"></script>
<!-- AND HERE -->
<script type="text/javascript" src="http://www.meandhimclients.co.uk/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/jquery.fancybox-1.3.4.pack.js"></script>
<script src="http://www.meandhimclients.co.uk/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/fancyboxcall.js"></script>

使用相对路径也更具可读性（我以为你在外部链接）：

<script type="text/javascript" src="/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="/beachhorizon/bh_wordpressdev/wp-content/themes/beach horizon/js/fancyboxcall.js"></script>

Answer 2

您是否编辑了fancybox.js文件的版本？它似乎已被腐蚀。尝试下载并重新安装。

您收到此错误：

Timestamp: 11/05/2012 11:29:38 AM
Error: missing ) after argument list
Source File: http://www.meandhimclients.co.uk/beachhorizon/bh_wordpressdev/wp-content/themes/beach%20horizon/js/jquery.fancybox-1.3.4.pack.js
Line: 45
Source Code:
b.fn.fancybox.defaults={padding:10,margin:40,opacity:false,modal:false,cyclic:false,scrolling:"auto",width:560,height:340,autoScale:true,autoDimensions:true,centerOnScroll:false,ajax:{},swf:{wmode:"transparent"},hideOnOverlayClick:true,hideOnContentClick:false,overlayShow:true,overlayOpacity:0.7,overlayColor:"#777",titleShow:true,titlePosition:"float",titleFormat:null,titleFromAlt:false,transitionIn:"fade",transitionOut:"fade",speedIn:300,speedOut:300,changeSpeed:300,changeFade:"fast",easingIn:"swing",

Answer 3

Fancybox不是图像查看器而不是iframe弹出窗口吗？如果你想要弹出一个iFrame，你可以创建一个边框图像，然后在其中创建一个iframe，然后在document.ready函数中，使其显示为淡入淡出，如下所示：

document.ready(function(){
  $("lightbox").fadeIn();
});

如何在页面加载时显示fancybox灯箱

3 个答案: