Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    Conwy. UK
    Posts
    122
    Thanks
    0
    Thanked 0 Times in 0 Posts

    A script that will display 1, 2 then 3 dots then return to 1 dot as a progress bar

    Hi Guys

    Whilst a page is loading (nothing at all to do with pre-loading images) I have a div(IE and NS6)/layer(NS4) displayed saying 'Please wait' (hidden when page finishes loading) from an external .js file. I want to add first one dot then two dots and finally three dots then retun to one dot etc etc after the 'Please wait' bit.

    I've tried a few ways with for loops and arrays but can't get anything to work. I've seen a number of 'page loading' scripts but all are based up on pre-loading images, which is not the case here.

    Can anybody give me a clue how to do this.
    An answer needs a question just as much as a question needs an answer. Deep eh!

  • #2
    New Coder
    Join Date
    Jul 2002
    Location
    Portugal
    Posts
    44
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <script>
    var timerHandle = setTimeout('Dots(1)',100);

    function Dots(numberOfDots)
    {
    switch(numberOfDots)
    {
    case 1:
    theDivName.innerText = 'Loading.';
    timerHandle = setTimeout('Dots(2)',100);
    break;
    case 2:
    theDivName.innerText = 'Loading. .';
    timerHandle = setTimeout('Dots(3)',100);
    break;
    case 3:
    theDivName.innerText = 'Loading. . .';
    timerHandle = setTimeout('Dots(1)',100);
    break;
    }
    }
    </script>
    <body onload="clearTimeout(timerHandle )">

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Conwy. UK
    Posts
    122
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Perfecto

    That works great, thanks a lot.

    A little question .. When my original 'page loading' div is hidden when the page completes it's loading (I use body onload to call a function to hide the div) will the Dots function carry on or does the clearTimeout(timerHandle ) stop it. If this is the case then that does not happen.

    I'm sorry if I'm being a bit thick here but I was just wondering.
    An answer needs a question just as much as a question needs an answer. Deep eh!

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    Whilst a page is loading...
    Hey - you English or sumpin'? Impressive.
    Dug this up:

    <html>
    <head>
    <title>untitled</title>
    <style type="text/css">

    #progressbar {
    font: 200 16px arial;
    background: black;
    }

    </style>
    <script type="text/javascript">

    var progchar = '&amp;#187;'; //try '&amp;#149;&amp;nbsp;' or '&amp;#164;'
    var speed = 111;

    var color = new Array();
    color[0] = '#440000';
    color[1] = '#550000';
    color[2] = '#661100';
    color[3] = '#772200';
    color[4] = '#883300';
    color[5] = '#994400';
    color[6] = '#aa5500';
    color[7] = '#bb6600';
    color[8] = '#cc7700';
    color[9] = '#dd8800';
    color[10] = '#ee9900';
    color[11] = '#ffbb00';
    color[12] = '#ffff00';

    function prog() {
    if (typeof prog.n == 'undefined') prog.n = 0;
    var z = '', d = document.getElementById('progressbar');
    d.style.color = color[prog.n];
    for (i=0;i<=prog.n;i++) z += progchar;
    d.innerHTML = 'loading, please wait ' + z;
    prog.n = (prog.n == 12) ? 0 : ++prog.n;
    progger = setTimeout('prog()',speed);
    }

    </script>
    </head>
    <body bgcolor="black">
    <span id="progressbar"></span>
    <script>
    prog();
    /* onload = function() {
    clearTimeout(progger);
    document.getElementById('progressbar').style.visibility = 'hidden';
    }*/
    </script>
    </body>
    </html>

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    Conwy. UK
    Posts
    122
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks Guys

    Spoilt for choice now.

    Yeah I'm English, (Watcha cocker, well I'll go t' bottom o' stairs, and stuff like that, old boy!!)

    Toodle pip
    An answer needs a question just as much as a question needs an answer. Deep eh!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •