Preloader...

Discussion in 'Javascript' started by Mateo, Jan 8, 2007.

  1. Mateo

    Mateo Guest

    Hi!

    I have web aplication,lots of scripting and server-side work, and it takes
    some time to load (if not cached). I would like to make some of those
    preloaders, you know, like progress bar or something saying : loading,
    please wait.... Is JS apropriate tool for such action? Any ideas? Any
    scripts on-line?
     
    Mateo, Jan 8, 2007
    #1
    1. Advertising

  2. Mateo

    Randy Webb Guest

    Mateo said the following on 1/8/2007 2:26 PM:
    > Hi!
    >
    > I have web aplication,lots of scripting and server-side work, and it takes
    > some time to load (if not cached). I would like to make some of those
    > preloaders, you know, like progress bar or something saying : loading,
    > please wait.... Is JS apropriate tool for such action? Any ideas? Any
    > scripts on-line?


    Put an animated "loading" image on the page.
    Hide all other content.
    onload hide the image and show the rest of the page.

    --
    Randy
    Chance Favors The Prepared Mind
    comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Jan 8, 2007
    #2
    1. Advertising

  3. Mateo

    Mateo Guest

    >
    > Put an animated "loading" image on the page.
    > Hide all other content.
    > onload hide the image and show the rest of the page.
    >


    yeap, sounds easy.... but...
    how can I catch that event when page is loaded from JS???

    and how can I hide all other content except this only one image?

    thanx!
     
    Mateo, Jan 8, 2007
    #3
  4. Mateo

    Randy Webb Guest

    Mateo said the following on 1/8/2007 3:44 PM:
    >> Put an animated "loading" image on the page.
    >> Hide all other content.
    >> onload hide the image and show the rest of the page.
    >>

    >
    > yeap, sounds easy.... but...
    > how can I catch that event when page is loaded from JS???
    >
    > and how can I hide all other content except this only one image?


    <body>
    <div id="bodyContent" style="visibility:hidden">
    All your content goes here
    </div>
    <div id="loadingDiv" style="visibility:visible">
    <img src="loading.gif">
    </div>

    <script type="text/javascript">
    window.onload = foo;
    function foo(){
    document.getElementById('bodyContent').style.visibility="visible";
    document.getElementById('loadingDiv').style.visibility="hidden";
    }
    </script>

    And then use CSS to position the two div elements.

    --
    Randy
    Chance Favors The Prepared Mind
    comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Answer:It destroys the order of the conversation
    Question: Why?
    Answer: Top-Posting.
    Question: Whats the most annoying thing on Usenet?
     
    Randy Webb, Jan 8, 2007
    #4
  5. Mateo

    RobG Guest

    Mateo wrote:
    > >
    > > Put an animated "loading" image on the page.
    > > Hide all other content.
    > > onload hide the image and show the rest of the page.
    > >

    >
    > yeap, sounds easy.... but...
    > how can I catch that event when page is loaded from JS???
    >
    > and how can I hide all other content except this only one image?


    If script is disabled, not available, errors before displaying the
    content or the load event doesn't occur, those users will see only the
    "loading..." image.

    Back in the good old days, some browsers showed a blank page until all
    content was loaded while others showed the page as it loaded. Users
    showed a marked preference for the latter, which is why (all?) modern
    browsers show the page as it loads.

    Reverting to a scheme abandoned long ago in favour of a better one
    doesn't make much sense - but hey, it's your page.

    --
    Rob
     
    RobG, Jan 8, 2007
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. jj
    Replies:
    3
    Views:
    1,269
    bruce barker
    Jan 20, 2009
  2. FluxForums

    Image Preloader

    FluxForums, Feb 22, 2004, in forum: Javascript
    Replies:
    3
    Views:
    119
    Hywel
    Feb 22, 2004
  3. David

    Stop do while loop - image preloader

    David, Aug 10, 2005, in forum: Javascript
    Replies:
    4
    Views:
    175
    David
    Aug 10, 2005
  4. Image Preloader

    , Dec 4, 2005, in forum: Javascript
    Replies:
    2
    Views:
    110
  5. Ross

    preloader not working

    Ross, Jan 5, 2006, in forum: Javascript
    Replies:
    8
    Views:
    110
    Thomas 'PointedEars' Lahn
    Jan 5, 2006
Loading...

Share This Page