javascript - Fancybox 1.3.4 无法正常工作

Question

嘿，我正在尝试实现 fancybox 1.3.4，但我无法让它工作 这是我的代码:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery    /1.4/jquery.min.js"></script>
<script type="text/javascript" src="/fancybox/jquery.easing-1.3.pack.js"></script>
<script src="/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<script src="/fancybox/jquery.fancybox-1.3.4.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css"   media="screen" />
<script type="text/javascript">

$(document).ready(function() {

/* This is basic - uses default settings */

$(".image").fancybox();

/* Using custom settings */

$(".iframe").fancybox({
    'hideOnContentClick': false
});


$("a[href$=.jpg],a[href$=.png],a[href$=.gif]").fancybox();

$(".youtube").click(function() {
    $.fancybox({
        'padding': 0,
        'autoScale': false,
        'transitionIn': 'none',
        'transitionOut': 'none',
        'title': this.title,
        'width': 680,
        'height': 495,
        'href': this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
        'type': 'swf',
        'swf': {
            'wmode': 'transparent',
            'allowfullscreen': 'true'
        }
    });

    return false;
});

这是我希望 fancybox 打开的图像。目前它只是显示在一个新标签中。 我使用 firebug，我可以看到每个脚本和样式表都已加载。

 <a class="image" href="http://localhost:2053/files/15-20/theme3/test%20Photo.jpg">test Photo</a>

Answer 1

我猜这只是一个剪切和粘贴错误，但为了以防万一，我将说明明显的情况。您的 jquery 路径中有空格:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery    /1.4/jquery.min.js"></script>

应该是:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

要 100% 确保 jquery 已加载，请打开 Firebug 控制台并运行此代码段:

$().jquery;

它应该通过打印版本号来响应。