Fancybox slideshow in iframe as in facebook album

Question

I have success.php page in which I am fetching albums of user which is logged in. Each album is clickable and user gets redirected on albumphoto.php. This page gets albumId from GET request and displays all the photo of that album. On clicking any album, I am opening an Jquery Fancybox iframe. Currently, It echoes all photos in the iframe. Below is code.

Page: Success.php

 <a class="fancybox fancybox.iframe" href="albumphoto.php?album_id=<?php echo $album['id']?>" style="text-decoration: none"><?php echo $album['name'];?> 

Page : albumphoto.php

 $album_id = $_GET['album_id'];

 $photos = $facebook->api("/{$album_id}/photos"); // just get that one album
foreach($photos['data'] as $photo)
{
    echo "<img src='{$photo['source']}'  />";   
}

I want to make slideshow in iframe for all the photos .Suggest me how this can be done ? I dont get any help. Thanks in advance.

Answer 1

You can add below code under document.ready function script tag of the page.

$.fancybox([
            <?php
            foreach($photos['data'] as $photo)
            {
                echo "'{$photo['source']}',\n";
            }
            ?>
        ], {
            'padding'           : 0,
            'transitionIn'      : 'elastic',
            'transitionOut'     : 'elastic',
            'type'              : 'image',
            'scrolling'         :  'auto',
            'width'             : 'auto',
            'height'            : 'auto',
            'autoResize'            : true,
            'nextClick'         :  true,
            'closeBtn'          :  false,
            'changeFade'        : 0
        });

Glad to solve this :)