Question

How to check my all jQuery files are completely loaded or not.

I want to show my div only when all the jQuery files related to that div is loaded.

document ready and window load function doesn’t work.

How to write a conditional function where u can check whether all the jQuery is loaded then show the div…. i am calling all my jQuery files in an external js file, (basically i am trying to create a plugin for my client so that my external.js file will work from my server remotely).

       if (typeof jQuery === "undefined") {
       var script = document.createElement('script');
       script.src = 'js/jquery-1.7.1.min.js';
       script.type = 'text/javascript';
       document.getElementsByTagName('head')[0].appendChild(script);

       }

      if (typeof jQuery === "undefined") {
      var script = document.createElement('script');
      script.src = 'js/fancybox.js';
      script.type = 'text/javascript';
      document.getElementsByTagName('head')[0].appendChild(script);
     }

     document.ready = function() {
     $(document).ready(function(){

       $("#addimage").html("<a id='fancybox' href='large"+clientID+".jpg'><img border=0 src='thumb"+clientID+".jpg'/></a>");

     }
     });

so i want this addimage div work only my jquery files is loaded completely

Answer 1

To show the div when all script loaded you just need to write /include the script before all those div you want to show after script loaded

and to check the external script is loaded this might be helpfull JavaScript to detect when external javascripts are loading

you can check this by firebug

and in firebug see this section

1.first click on the 1 i have pointed its the net

2.and after that click on the second js

in firebug you will also know how much time the script take to load