Question

I’ve got a Jquery plugin for a fancybox, which I know works when I use the following code:

$("a#roomthumb_2237").fancybox({ 
        'href'   : '#2237_Info',
        'titleShow'  : false, 
        'transitionIn'  : 'elastic', 
        'transitionOut' : 'elastic' 
});

But to stop me having to repeat this code multiple times (with different href values), I’d like to run it in a for loop.

The code I’ve tried is:

for (var i = 0; i < rooms_array.length; i++) {
    var d = "#roomthumb_"+rooms_array[i]
    $(d).fancybox({ 
        'href'   : rooms_array[i]+'_Info', 
        'titleShow'  : false, 
        'transitionIn'  : 'elastic', 
        'transitionOut' : 'elastic' 
    });
};  

The original code I took straight from google (it may well have been from stackoverflow, I can’t remember), but as soon as I try to put it the loop, I’m lost, since I’ve no idea how to write it. I think the href line is wrong, but I can’t find anything that explains how to do what I need it to.

I dont know how to write the $(“a#roomthumb_2237”) as $(“a”+d) for example…

Answer 1

I fixed my own issue. My loop was fine, the only line of text that was wrong, which is what I thought, was:

    'href'   : rooms_array[i]+'_Info',

I needed to be:

    'href'   : '#'+rooms_array[i]+'_Info',

Which now I’ve noticed, is really obvious… I hadn’t added the selector.

Edit:
Here is my full code, which now works. Note – I’ve chosen random numbers for my array, just to show the idea:

var rooms_array = [2235, 2236, 2237, 2238]; 
var reposition = function (){ 
    $('#hidden_stuff').attr('display', "none"); 

    $.each(rooms_array, function(key,value){ 
        var a = '#roomthumb_'+value;  
        var b = '#chosenrate_'+value; 

        if ($(b).length) { 
            var c = $(b).offset();  

            $(a).css({ 
                visibility:"visible", 
                top: c.top -9 + "px", 
                left: c.left + 560 + "px" 
            })
        }
        else{ 
        } 

        $(a).fancybox({ 
            'href'   : '#'+value+'_Info', 
            'titleShow'  : false, 
            'transitionIn'  : 'elastic', 
            'transitionOut' : 'elastic' 
        });
    }); 
};