Jquery Preload content In Fancybox 2

Question

I also wanted to use the jquery load.() function to preload the forms and load them when the fancybox is trigger. I know the script to preload the forms but how to I make it only show when the fancybox is triggered?

Fancybox script

$(".fancybox").fancybox({
afterLoad: function () {
    if (this.type == "inline") {
        this.width = this.element.data("width");
        this.height = this.element.data("height");}}
'content' : $( "#new-projects" )    });

Preload Content

$( "#new-projects" ).load( "/resources/load.html #projects li" );

Answer 1

load the content in hidden div,

$( "#new-projects" ).load( "/resources/load.html #projects li" );

then use content option of fancybox, as:

$(".fancybox").fancybox({
    ....
    'content' : $( "#new-projects" )
});

Edit:: you have extra parenthesis, do,

$(".fancybox").fancybox({
    afterLoad: function () {
        if (this.type == "inline") {
            this.width = this.element.data("width");
            this.height = this.element.data("height");
        }
    'content' : $( "#new-projects" )    
});