CODEWITHSUNDEEP
javascriptjqueryhtmlcss
oshirowanen
oshirowanen

Reputation: 15925

Detected when everything has finished downloading

Using only HTML, CSS, and Javascript, has the web development world got to a stage where it is possible to display a loading message on the screen until absolutely everything has downloaded before the web page is displayed on the screen?

For example, display "loading", until all html, css, javascript, images etc etc have downloaded and can be displayed without the user seeing bits of the website still appearing after the load message has gone?

UPDATE, .LOAD DOESN'T WORK:

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title></title>

        <script  type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>

        <script type="text/javascript">

            $(document).load(function(){

                alert("loaded");

            });

        </script>
    </head>
    <body>

    </body>
</html>

Upvotes: 1

Views: 638

Answers (3)

Adil
Adil

Reputation: 148120

you can use $(window).load()

$(window).load(function(){
    alert("");
})

Upvotes: 1

Jai
Jai

Reputation: 74738

Absolutely this will be achieved with jQuery and javascript no doubt:

$(function(){

    $('body').addClass('loader'); // this will show the loading gif

    $(window).load(function(){
        $('body').removeClass('loader'); // remove the loader when window gets loaded.
        $('#wrapper').show();    // show the wrapper div after everything loaded.
    });

});

Upvotes: 2

augustomen
augustomen

Reputation: 9739

Yes, <body> has a onLoad property described here, for example:

<script type="text/javascript">
function done() {
    document.getElementById("loadingtext").innerHTML = "";
}
</script>

<body onload="done()">
<div id="loadingtext">Loading...</div>

But then, of course, it's easier to use a framework.

Upvotes: -1

Related Questions