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.

HTML

<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">
<p>Scroll down for image</p>
<div id="box">
    <h1>Open!</h1>
</div>

CSS

/*  Note that the fancybox css file is loaded under the 
"Add Resources" tab to the left.  Normally you would load it in your <head> */

body {
   background-color: #eef;     
}

#box
{
    margin-top: 1000px;
    margin-bottom: 500px; /* So we can scroll past */
}

JavaScript

var fired = false;
$(document).ready(function () {
    $(document).scroll(function () {
        if($(document).scrollTop() >= $('#box').offset().top && !fired)
        {
             $.fancybox.open([
             {
                 href : 'http://fancyapps.com/fancybox/demo/1_b.jpg',                
                 title : '1st title'
             }]);
            fired = true; //Keep from trying to constantly open on scroll
            //There are better ways to do this, this is simply for demonstrations sake.
        }
    });
});