2

嗨,我需要一些帮助,以便在页面加载时打开一个 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 页面没有在窗口中加载。任何帮助表示赞赏。

谢谢罗伯

4

3 回答 3

0

您是否编辑了您的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", 
于 2012-05-11T18:44:21.307 回答
0

我不知道这是否是你的问题的原因,但你有两次调用 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>
于 2012-05-10T15:39:34.510 回答
0

Fancybox 不是图像查看器而不是 iframe 弹出窗口吗?如果你想要一个 iFrame 弹出,你可以创建一个边框图像,然后在其中制作一个 iframe,然后在document.ready函数中,让它以淡入淡出的形式出现,如下所示:

document.ready(function(){
  $("lightbox").fadeIn();
});
于 2012-05-12T10:53:46.563 回答