CODEWITHSUNDEEP
javascriptjquerydelay
Tariq Ahmed
Tariq Ahmed

Reputation: 306

Delay Loading Javascript to speed my Joomla

I'm using joomla site, and Forced to use extra java script.

My Question is:

  1. How to force loading the javascript ONLY after page complete
  2. I dont mean DELAY them, But make them in Queue till the page complete loading.

I tried many of links tutorial but nothing helps me.

Please,

Would you provide correct example in order to make me understand.

Example to JS file I inserted to buttom of my page:

<script src="/js/easing.js" type="text/javascript"></script>

Can you provide Jquery code to force all those script to wait till the page load complete?

Thank you

Tariq

Upvotes: 0

Views: 1138

Answers (2)

Aleš Kotnik
Aleš Kotnik

Reputation: 2724

Use <script src="..." async="async"/>. In modern browsers (HTML5)it will spawn fetching javascript files separately and won't delay loading of your HTML. You can just put script tags at the end of your <body>.

Upvotes: 1

Avihay Menahem
Avihay Menahem

Reputation: 238

Ales Kotnik answer's in great, and also if you want to do it in your own specifiec time, you can do something like that:

function loadScript(url, callback){

var script = document.createElement("script")
script.type = "text/javascript";

if (script.readyState){  //IE
    script.onreadystatechange = function(){
        if (script.readyState == "loaded" ||
                script.readyState == "complete"){
            script.onreadystatechange = null;
            callback();
        }
    };
} else {  //Others
    script.onload = function(){
        callback();
    };
}

script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}

this will load a script only when you call it, and then you activate it like this:

<script type="text/javascript" src="http://your.cdn.com/first.js"></script>
<script type="text/javascript">
loadScript("http://your.cdn.com/second.js", function(){
    //initialization code
});
</script>

Upvotes: 1

Related Questions