fancybox Plugin for jQuery

From fancybox.net: FancyBox is a tool for displaying images, html content and multi-media in a Mac-style "lightbox" that floats overtop of web page. Here I trigger a fancybox to open by code rather than a user click.

by John Doe

HTML

<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">
<a class="fancybox" rel="gallery1" href="http://farm9.staticflickr.com/8199/8220132885_9e693356e9_b.jpg" >Image</a>
 -
<a class="fancybox" rel="gallery1" data-fancybox-type="iframe" href="http://www.youtube.com/embed/L9szn1QQfas">Video</a>
 -
<a class="fancybox" rel="gallery1" href="http://farm9.staticflickr.com/8208/8220638290_d64cb4497b_b.jpg">Image</a> 
 -
<a class="fancybox" rel="gallery1" href="http://farm9.staticflickr.com/8349/8225268620_4e00a8f603_b.jpg">Image</a>

CSS

.fancybox-type-iframe .fancybox-nav {
    width: 10%;
    height: 70%;
    margin: 15% 0;
}

JavaScript

$(document).ready(function () {
    $('.fancybox').fancybox();
});