<a href="large.jpg" class="lightbox" title="Image caption text.">
	<img src="thumbnail.jpg" alt="">
</a>
$(".lightbox").lightbox();
<a href="large_1.jpg" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="thumbnail_1.jpg" alt="">
</a>
<a href="large_2.jpg" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="thumbnail_2.jpg" alt="">
</a>
<a href="large_3.jpg" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="thumbnail_3.jpg" alt="">
</a>
$(".lightbox").lightbox();
<a href="large_1.jpg" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="thumbnail_1.jpg" alt="">
</a>
<a href="large_2.jpg" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="thumbnail_2.jpg" alt="">
</a>
<a href="large_3.jpg" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="thumbnail_3.jpg" alt="">
</a>
$(".lightbox").lightbox({
thumbnails: true
});
<a href="//www.youtube.com/embed/XXXXX?rel=0&autoplay=1&fs=1" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="youtube.jpg" alt="">
</a>
<a href="//player.vimeo.com/video/XXXXX?title=0&byline=0&portrait=0&autoplay=1&badge=0" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="vimeo.jpg" alt="">
</a>
<a href="//www.viddler.com/embed/XXXXX/?f=1&player=full&secret=XXXXX" class="lightbox" data-lightbox-gallery="gallery_name" title="Image caption text.">
	<img src="viddler.jpg" alt="">
</a>
$(".lightbox").lightbox({
videoFormatter: {
"viddler": {
pattern: /(?:viddler\.com\/)((v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?\/]*)/,
format: function formatViddler(parts) {
return '//www.viddler.com/embed/' + parts[6];
}
}
}
});
<a href="large_1.jpg" class="lightbox" title="Image caption text.">
	<img src="thumbnail_1.jpg" alt="">
</a>
$(".lightbox").lightbox({
overlay: true
});
<a href="large_1.jpg" class="lightbox" title="Image caption text.">
	<img src="thumbnail_1.jpg" alt="">
</a>
$(".lightbox").lightbox({
overlay: true,
viewer: false
});
<a href="large.jpg" class="lightbox" title="Image caption text.">
	<img src="thumbnail.jpg" alt="">
</a>
$(".lightbox").lightbox({
fixed: true
});
<a href="large.jpg" class="lightbox" title="Image caption text.">
	<img src="thumbnail.jpg" alt="">
</a>
$(".lightbox").lightbox({
top: 25
});
<a href="#hidden_content" class="lightbox"
	Open Hidden Content
</a>
<div id="hidden_content" style="display: none;">
	<div class="inline_content">
		<h2>Inline Content!</h2>
	</div>
</div>
$(".lightbox").lightbox();
<a href="#" class="launch_lightbox">
	Open jQuery Content
</a>
$(".launch_lightbox").click(launchLightbox);
function launchLightbox() {
var $content = $('More Content!
');
$.lightbox( $content );
}
<a href="http://example.com" class="lightbox">
	Example.com
</a>
$(".lightbox").lightbox();
<a href="http://example.com" class="lightbox" data-lightbox-height="500" data-lightbox-width="500">
	Example.com
</a>
$(".lightbox").lightbox();
<a href="large.jpg" class="lightbox" title="Image caption text.">
	<img src="thumbnail.jpg" alt="">
</a>
$(".lightbox").lightbox({
formatter: formatLightboxCaption
});
function formatLightboxCaption() {
return "<h3>" + $(this).attr("title") + "</h3>";
}