Double-Page-Spread Cycle slideshow

The following code is part of wordpress slideshow jQuery script. Its purpose is to achieve a specific logic in the slideshow where all vertical images are displayed as pairs (like a magazine’s double page).

function initSlideShow() {

//some stuff to append images in $hidden_ic (temp image container far far away - not hidden so the script can measure their dimensions)

//Step 3. Loop and transform
$hidden_ic.find('img').each(function(i, o){
var $img = $(this),
h = $img.height(), //current image height
w = $img.width(), //current image width
v = (h > w ? true : false), //current image vertical flag
nv = null, //next image vertical flag
$prev = $hidden_ic.find('img:eq(' + (i - 1) + ')'), //next image object
$next = $hidden_ic.find('img:eq(' + (i + 1) + ')'); //prev image object

if(typeof($img.attr('data-or')) === 'undefined' || $img.attr('data-or') === false)
{
//Save orientation
$img.attr('data-or', (v ? 1 : 0));

//Create new slide
var $slide = $('<div class="slide" />');

//Append a clone of current image
$slide.append($img.clone());

//If its not last
if($next.size()>0)
{
var nh = $next.height(), //next image height
nw = $next.width(), //next image height
nv = (nh>nw ? true : false); //next image vertical flag

if(v && nv) //if current and next one are both vertical
{
$next.attr('data-or', (nv ? 1 : 0)); //Save orientation
$next.addClass('right'); //Apply right floating

$slide.append($next.clone()); //Append a clone of the next image to the same slide
$slide.find('img').first().addClass('left');
}

if(v && !nv) //if current vertical and next one horizontal
{
$slide.find('img').first().addClass('left');
}

}

$main_ic.append($slide); //Append slide to main container
}
});

After the $slide‘s are created I pass them to jQuery Cycle to create the slideshow.

My problem is that I can’t find a way for the pager to display both images of the doublepage slides (it displays only the first img). Here is my Cycle code:

$main_ic.cycle({
        fx:     'fade', 
        speed:   300, 
        timeout: 0, 
        next:   '.nextnav', 
        prev:   '.prevnav', 
        pause:   1,
        pager: '#pager',
        after: onAfter,
        pagerAnchorBuilder: function(idx, slide) { 
            return '<a href="#"><img src="' + jQuery(slide).find('img').first().attr('src') + '" height="100" /></a>';
                } 
}).fadeIn('slow');

I would really appreciate any help. Thanks for your time.