Question

Hi I want to inject an extra data to facybox title function deneme is the variable that I want to inject with no success.

<a rel="example_group" title="Title comes here" data-deneme="<?php echo $galleryitem['idphotos']; ?>">sdasd</a>

$("a[rel=example_group]").fancybox({
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'titlePosition'     : 'over',
            'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
                var deneme=$(this).data('deneme');

                return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span><span stye="color:#FFF; cursor:pointer;" onclick="javascript:popUpWindow(&quot;<?php echo base_url();?>selectproductoptions/'+ deneme +'.html&quot;,10,10,660,550);">+ add to cart</span>';
            }
        });

deneme always comes undefined

I figured out how to do that instead of trying to get deneme separately I have put to deneme just after the href like urlofimage.jpg?DenemeComesHere

and to grab deneme I have used jquerys split function like so

var deneme = currentOpts.href.split(‘?’);

Thank you…

Answer 1

If using fancybox v1.3.4 :

Unfortunately you cannot use $(this) (neither this) to refer to the element from where you invoked fancybox (let’s say it’s a design bug) so you have to refer to the whole selector $("a[rel=example_group]"). To filter the current element, use the currentIndex parameter passed through the titleFormat API function like :

'titleFormat': function(title, currentArray, currentIndex, currentOpts) {
                var deneme = $("a[rel=example_group]").eq(currentIndex).data('deneme');
                return '...etc'
}

… or :

'titleFormat': function(title, currentArray, currentIndex, currentOpts) {
                var deneme = $("a[rel=example_group]:eq("+currentIndex+")").data('deneme');
                return '...etc'
}

… whatever you prefer.

If using fancybox v2.x+

You can refer to $(this) using $(this.element)

In the case of your title, add the variable using the callback beforeShow like :

$("a[rel=example_group]").fancybox({
  // other API options
  beforeShow: function(){
    var deneme = $(this.element).data('deneme');
    this.title = 'some html' + this.title + 'other html' ... etc
  }
});