Fancybox 1.3.4 just wont work

Hey im trying to implement fancybox 1.3.4 and I just cant get it to work Heres my code:

<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 sr开发者_C百科c="/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;
});

This is the image I want fancybox to open. Presently it just shows up in a new tab. I use firebug and I can see that every script and stylesheet loads.

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

I'm guessing this was just a cut & paste error, but I'm going to state the obvious just in case. Your path to jquery has spaces in it:

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

It should be:

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

To be 100% doubleplus sure that jquery is loaded, open up the Firebug console and run this snippet:

$().jquery;

It should respond by printing the version number.

It looks like your document.ready function isn't enclosing all of your selector statements. You also might be missing the closing script tag.

Try adding this to the end of your script:

    });
</script>

Full script:

    <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;
  });
});
</script>

you should change the src to

<script type="text/javascript" src="fancybox/jquery.easing-1.3.pack.js"></script>

instead of what you have here

<script type="text/javascript" src="/fancybox/jquery.easing-1.3.pack.js"></script>

read carefully to note the difference in the src attribute of the two samples, make this change to all the src attributes and you should be good to go.