Question

I use fancy box to open up some set width / height HTML pages without scroll bars but I’m unsure how to do this in the fancy box j-query function.

I have all the relevant scripts and Fancy box is working fine, but if I specify iframe it opens up at a small default size.

Do I alter this script?

<script type="text/javascript">
  $(document).ready(function(){
    $(".iframe").fancybox();
});
</script>

I want to open the HTML page from clicking on an image…

<div class="project">
<a class="iframe" href="#"><img src="images/portfolio/blank-image.jpg" alt="" width="150" height="100"></a>
</div>

Could anyone suggest how I would open up a window that is 800px width by 500px height without scroll bars (the HTML document will be created to fit those exact dimensions) and perhaps include some transitions like elastic?

Answer 1

You can specify fancybox options like so:

    <script type="text/javascript">
        $(document).ready(function () {
             $("a.iframe").fancybox({
                'width': 800,
                'height': 500,
                'transitionIn': 'elastic',
                'transitionOut': 'elastic',
                'type': 'iframe'
            });
        });
    </script>