CODEWITHSUNDEEP
javascriptjqueryjquery-pluginsfancybox
Abadaba
Abadaba

Reputation: 1466

Call fancybox with jquery element

I know there is a way to call fancybox manually with a string of html like so:

$.fancybox("<div>foo</div>")

However, i want to instead pass a jQuery object to the fancybox so i can retain things like .data() and click() events i have already added:

var $fooObj = $("div.foo").data("foo","bar");
$.fancybox($fooObj);

Is this possible somehow?

Upvotes: 4

Views: 7171

Answers (3)

namal
namal

Reputation: 1274

Simple Way!!!

$(document).ready(function () {
    $.fancybox({
        'width': '80%',
        'height': '80%',
        'autoScale': true,
        'transitionIn': 'fade',
        'transitionOut': 'fade',
        'type': 'iframe',
        'href': 'http://www.example.com'
    });
});

Upvotes: 0

Simon
Simon

Reputation: 5698

function LaunchFancyBox(code)
{
    jQuery.fancybox({
        content: code 
    });     
}

And in the onclick/click:

<a href="#" onclick="LaunchFancyBox('<div>test</div>'); return false;">Launch it baby</a>!

Upvotes: 2

Nick Craver
Nick Craver

Reputation: 630389

You just need to set it as the content property in the options you pass into $.fancybox(), like this:

$.fancybox({
    content: $fooObj 
});

You can test it out here.

Upvotes: 9

Related Questions