Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery - load multiple files and then trigger an event

Tags:

jquery

file

load

I'm trying to write code where if File A, B and C are loaded, an animation occurs. Right now I'm using the following code, but I was wondering if there isn't a simpler version to do this:

$(document).ready(function(){
    $("#file_A").load(function(){
        $("#file_B").load(function(){
            $("#file_C").load(function(){
            <!-- my animation script -->
            });
        });
    });    
});

This code though, doesn't really work for all situations. I would like something along the lines:

$(document).ready(function(){
    $("#file_A, #file_B, #file_C").load(function(){
    <!-- my animation script -->
    });    
});

Where basically I list all of the files I want to wait for to load and once that finishes, I start my animation script.

Thank you very much in advanced for any help!

like image 971
stefanplc Avatar asked Dec 15 '13 16:12

stefanplc


1 Answers

$.when( $("#file_A").load(function(){ <!-- only assignments -->  }),
        $("#file_B").load(function(){ <!-- only assignments -->  }),
        $("#file_C").load(function(){ <!-- only assignments -->  })
).then(function{ <!-- all files loaded -->  
                 <!-- my animation script -->  });    
like image 176
Konstantin Avatar answered Oct 02 '22 09:10

Konstantin