How to integrate an image gallery made with Roundabout with Fancybox?

Question

I am trying to create a compact image gallery using the Roundabout plugin.

The carousel should rotate the thumbnails and, only for the image currently on focus,

Answer 1

In addition to what the options you're

$('ul.image-gallery').find('li').focus(function() {
        $(this).find('a').fancybox.cancel();
    }
});

This assumes that you are using roundabout on the ul, and fancybox on the anchor tags inside of them. When the roundabout gives focus to an li, it cancels the fancybox that will do the same thing.

Answer 2

ok, after inspecting the page you have mentioned, the focus image have roundabout-in-focus class so following may resolve this issue. try it

$(function() {
    $('ul.image-gallery').roundabout({
        duration: 1200
    });
    //$('ul.image-gallery .roundabout-in-focus a').fancybox();
});

Edit: try to map the click event of focused image link and open fancybox manually for link url. Also remove fancybox mapping in above function. (I've commented it in code)

$('ul.image-gallery .roundabout-in-focus a').live('click',function(event){
event.preventDefault();
$.fancybox({'href':$(this).attr('href')});
})