Fancybox long height image

Ready to use for fancybox examples

by kuyabiye

HTML

<script src="http://dl.dropbox.com/u/6696146/cdn/fancybox/jquery.easing-1.3.pack.js"></script>
<link rel="stylesheet" href="http://dl.dropbox.com/u/6696146/cdn/fancybox/jquery.fancybox-1.3.4.css">
<script src="http://dl.dropbox.com/u/6696146/cdn/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<ul>
    <li>
        <a class="fancybox" href="http://lorempixum.com/400/200/sports/1">
            <img src="http://lorempixum.com/50/50/sports/1" /></a></li>
    <li>
        <a class="fancybox" href="http://lorempixum.com/400/200/sports/2">
            <img src="http://lorempixum.com/50/50/sports/2" /></a>
    </li>
    <li>
        <a class="fancybox" href="http://lorempixum.com/200/1200/sports/3">
            <img src="http://lorempixum.com/50/50/sports/3" /></a>
    </li>
    <li>
        <a class="fancybox" href="http://lorempixum.com/400/200/sports/4">
            <img src="http://lorempixum.com/50/50/sports/5" /></a>
    </li> 
</ul>

JavaScript

$('.fancybox').fancybox({
    'type': 'image', /* for lorempixum */
    autoScale : false,
    onComplete: function() {

        var _height = $(document).height();
        console.log(_height);
        
                   $('#fancybox-overlay').height(_height );
    }
});