jQuery PrettyPhoto/Lightbox with Loupe Magnifier

Question

I'm trying to crowbar a magnifier, like this one, into prettyPhoto (picked because the JavaScript is nice). The trouble I'm having is initiating the loupe function when the prettyPhoto has loaded. If I include it in the prettyPhoto JavaScript, it just gets itself into an endless loop, or doesn't get called at all. I've nearly got it working by putting a link next to the close button that calls the function inline, like so;

<a href="#" onclick="$(\'.TB_Image\').loupe(); return false;">Magnify</a>

The only problem here is that the return false doesn't work? It works when the call to loupe isn't in the onclick event though? Doing it this way does run the loupe function, but the homepage gets loaded so I don't know if it actually works or not.

How can I solve this problem?

All help much appreciated!

Update:

Ok, little progress, I've got the function calling by using the onclick event on a span rather than an a tag. The alert now shows which tells me the loupe function has been called in, but the magnifier doesn't actually show.

Any ideas would be appreciated.

Answer 1

The backslashes are making your JS invalid. It should be:

onclick="$('.TB_Image').loupe(); return false;"