Navigation arrows not working in fancybox

Question

I'm trying to make fancybox2 work on my website and am having problems with navigation arrows.

Clicking on prev/next arrow when looking at an image which is part of a gallery (same rel) just lead to an empty squared fancybox with "next" (or "previous") as a title. I'm not able to go back to the image I was looking and must close the fancybox.

What is weird is that Fancybox seems to work correctly though, all scripts and css are correctly loaded, I'm able to open an image in a fancybox and even to navigate between items of the same gallery either with the keyboard or by clicking on content when activating the nextclick option (hence showing that my own options are correctly taken into account).

Configuration: wordpress 3.3.1, php 5.5.9, tested on updated Chrome and FF.

Here are some codes portion I used:

jQuery(document).ready(function() {

jQuery("a[class*=fancybox]").fancybox({
        nextClick:'true',
        openEffect      : 'elastic',
        closeEffect     : 'fade',
        nextEffect      : 'easeOutBack',
        prevEffect      : 'easeInBack',
        helpers : {
            title : {
                type : 'outside'
            }
        },

  });

});

And on my page, my gallery is set up with different items defined as follows:

<a rel="gallery" class="gallery fancybox" href="link to myimage.jpg"></a>

Thanks for any help given!

Answer 1

For starters you should use jQuery("a.fancybox") in to initiate your fancybox on and I doubt your php version is correct.

If you're getting an empty fancybox then that could mean the object that is next/prev wasn't loaded properly.

Also check for errors in the console (in Chrome F12) and post those. The information you've given us to debug is a little meager.