views:

655

answers:

1

I am trying to use jQuery Fancybox to popup a youtube video from a website. I have followed the instructions from the fancybox.net site, but no joy, the video simply appears inline.

I have all the .js files in place, the .css file in place, but as you can see here: http://www.rouviere.com/~idp2/ideaPeople.html clicking on the image only brings up the video inline.

It should work like the video link here: http://fancybox.net/example but it doesn't.

Here is the code:

$(document).ready(function() {
$("a#single_1").fancybox();

$("a#single_2").fancybox({
    'zoomOpacity'           : true,
    'overlayShow'               : false,
    'zoomSpeedIn'           : 500,
    'zoomSpeedOut'          : 500
});

$("a#single_3").fancybox({
    'overlayShow'           : false,
    'zoomSpeedIn'           : 600,
    'zoomSpeedOut'          : 500,
    'easingIn'              : 'easeOutBack',
    'easingOut'             : 'easeInBack'
});

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

  });
+1  A: 

Don't include both the packed, and the unpacked js files...

Use only

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

Also, your fancybox CSS file cannot be found. It contains the required styles to build the floating div.

http://www.rouviere.com/~idp2/fancybox/fancybox.css

Wadih M.
I wear glasses, but sometimes just don't have enough eyes to catch everything. Thanks for the good catch on the css link. That made the difference. Thanks!
fmz
Don't sweat it, i used fancybox before and I know how well it worked for me :)
Wadih M.