jqueryfancybox

how to use fancybox


I have an array of links like this:

<a title="G0" id="hotel_img_0" rel="hotel_img" href="#"></a>
<a title="G1" id="hotel_img_1" rel="hotel_img" href="#"></a>
<a title="G2" id="hotel_img_2" rel="hotel_img" href="#"></a>
<a title="G3" id="hotel_img_3" rel="hotel_img" href="#"></a>

how should I make fancybox work? I have no class for anchors which is why cannot use $(".class_name").fancybox() I tried the same id for all of the anchors and $("#id_value").fancybox() - fancybox does not work.


Solution

  • you can bind fancybox to all elements with the same rel attribute (and without having any class) like

    $("a[rel=hotel_img]").fancybox();
    

    See JSFIDDLE


    EDIT :

    You could also group elements with different rel attributes within the same fancybox initialization script like :

    $("a[rel=hotel_img], a[rel=standart_room_img], a[rel=agents_room_img]").fancybox();
    

    See updated JSFIDDLE