jQuery Fancybox use function to cut down code...

Question

Hi,

I'm using Fancybox to open a number of links from a menu and I wondered if there's a function to do this instead of writing out each one. I'm using:

$("#linkID").fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'fade',
'transitionOut' : 'fade'
});

And I was trying to use:

$(document).ready(function() {

    function FancyBoxItemMenu(linkID){
     $("#linkID").fancybox({
     'padding' : 0,
     'autoScale' : false,
     'transitionIn' : 'fade',
     'transitionOut' : 'fade'
     });
    };

On the menu item (an "a" tag) I used:

onClick="javascript:FancyBoxItemMenu(this.value);"

But that doesn't seem to do it and I think I'm close, but there's something I'm missing.

Thanks in advance, Steph

Answer 1

To solve your immediate problem, you need to append the string, like this:

$("#" + linkID).fancybox({

And use this.id instead of this.value.

---

A better idea overall approach would be to give the links a common class, for example:

<a class="fancybox" href="....">Link Text</a>

The just use that class as the selector:

$(".fancybox").fancybox({