sasa
sasa

Reputation: 2443

Jquery - fancybox and callback

I have problem with fancybox.
I want to write a function that will run when the fancybox opened. How and when to call the function?

Example:

function myFunc() {
    alert("Opened!");
}

$('.content a').fancybox({ 
    'hideOnContentClick': false ,
    'callBackOnShow': myFunc(), // This not working! It call function when page is loaded
    'frameWidth': 920,
    'frameHeight': 530
});

Upvotes: 8

Views: 52060

Answers (7)

James Nicholson
James Nicholson

Reputation: 973

As your title says "Jquery - fancybox and callback", You can a complete list of callback options for the fancybox 2 plugin found under the tab callbacks.

http://fancyapps.com/fancybox/#docs

If your using the old fancybox, maybe upgrading to fancybox2 as the new plugin has better features, with more control.

Upvotes: 0

Qwerty
Qwerty

Reputation: 31939

The newest way how to make it work is using afterShow or beforeShow:

$("a#registrace").fancybox({
  beforeShow   : function() {
    alert('its working!');
    validate_reg_form();
  }
});

I am loading registration form through ajax and I need to enable form-validation. In both cases (before and after), the content is already loaded.

Upvotes: 10

Gabriel
Gabriel

Reputation: 1900

This works

$("#element").fancybox({
    onStart     :   function() {
        return window.confirm('Continue?');
    },
    onCancel    :   function() {
        alert('Canceled!');
    },
    onComplete  :   function() {
        alert('Completed!');
    },
    onCleanup   :   function() {
        return window.confirm('Close?');
    },
    onClosed    :   function() {
        alert('Closed!');
    }
});

Upvotes: 11

Mario Menger
Mario Menger

Reputation: 5902

'callbackOnShow': myFunc

lower case b as the options are case sensitive, and no brackets on myFunc, as you want to pass the function as an option, not call it.

Upvotes: 2

Rik Heywood
Rik Heywood

Reputation: 13972

Actually, on checking the docs, you have a typo in your option list...

You have callBackOnShow but it should be callbackOnShow (lower case b)

Upvotes: 3

Rik Heywood
Rik Heywood

Reputation: 13972

It should be:-

function myFunc() {
    alert("Opened!");
}

$('.content a').fancybox({ 
    'hideOnContentClick': false ,
    'callBackOnShow': myFunc, // no brackets
    'frameWidth': 920,
    'frameHeight': 530
});

Or, you can make an anonymous function...

$('.content a').fancybox({ 
    'hideOnContentClick': false ,
    'callBackOnShow': function() { alert('hello'); },
    'frameWidth': 920,
    'frameHeight': 530
});

Upvotes: 2

Matt Briggs
Matt Briggs

Reputation: 42178

Instead of myFunc() use myFunc. In javascript, a function with parens (and/or args) means you want to call it. A function name without them means you just want a reference to that function (which is probably what fancybox wants from you)

Upvotes: 24

Related Questions