Get target attributes in Jquery fancybox image slider

Question

<a  data-id="oNz" class="fancybox-buttons"data-fancybox-group="thumb" href="/Images/Axbaz.jpg">
        <img title="Love" class="ajax" src="/thumbs/Axbaz.jpg" alt="">
</a>

I'm customizing fancybox Jquery plugin...
I want to (Get) alert data-id="oNz" property value and more target attributes When image showing or changing...
what this selector in fancybox plugin?

Answer 1

You can use $(this.element) to refer to $(this) inside any fancybox callback.

To get the data-id attribute's value (or any or more attributes), as in your example, you can use the afterLoad callback like :

$(".fancybox-buttons").fancybox({
    afterLoad: function () {
        // get (data) attributes from current element
        var attr1 = $(this.element).data("id"),
            attr2 = $(this.element).data("fancybox-group");
        alert(attr1 +", "+attr2);
    }
});

See JSFIDDLE