Results 1 to 2 of 2

Thread: Embed progress bar in conveyor belt

  1. #1
    Join Date
    Nov 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Embed progress bar in conveyor belt

    Hi there,

    I have installed the conveyor belt script in my website. It looks great!

    http://www.junglephotos.com/portalpagetest.shtml

    For an improvement I would like to embed an animated gif progress bar so that it lies inside the gray box that first appears before all images load. Here is the image source:

    <IMG SRC="/homegifs/progressbar10.gif" WIDTH="237" HEIGHT="37" HSPACE="0" VSPACE="0" BORDER="0" NAME="ProgBar" ALT="Generating photos, Please Wait..." TITLE ="Generating photos, Please Wait...">

    Could someone suggest how I do this? Where do I put this in the conveyor belt script? The idea is that once the images are loaded, the conveyor belt starts up and hides the progress bar gif.

    Thanks jscheuer1 (Mad Professor) for helping to get the images to load faster, but I'd still like something to show in that space to keep our low bandwidth visitors occupied.

  2. #2
    Join Date
    Nov 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Sorry to bump this to the top of the queue but I was hoping that someone could help me out! Here is the progress bar script. How can I can I add this to the conveyor belt script so the progress bar is located within the conveyor belt area box? Please! I am really stuck...

    <table align="center"><tr><td>
    <div style="font-size:8pt;padding:2px;border:solid black 1px">
    <span id="progress1">&nbsp;&nbsp;</span>
    <span id="progress2">&nbsp;&nbsp;</span>
    <span id="progress3">&nbsp;&nbsp;</span>
    <span id="progress4">&nbsp;&nbsp;</span>
    <span id="progress5">&nbsp;&nbsp;</span>
    <span id="progress6">&nbsp;&nbsp;</span>
    <span id="progress7">&nbsp;&nbsp;</span>
    <span id="progress8">&nbsp;&nbsp;</span>
    <span id="progress9">&nbsp;&nbsp;</span>
    </div>
    </td></tr></table>
    <script language="javascript">
    var progressEnd = 9; // set to number of progress <span>'s.
    var progressColor = 'blue'; // set to progress bar color
    var progressInterval = 1000; // set to time between updates (milli-seconds)

    var progressAt = progressEnd;
    var progressTimer;
    function progress_clear() {
    for (var i = 1; i <= progressEnd; i++) document.getElementById('progress'+i).style.backgroundColor = 'transparent';
    progressAt = 0;
    }
    function progress_update() {
    progressAt++;
    if (progressAt > progressEnd) progress_clear();
    else document.getElementById('progress'+progressAt).style.backgroundColor = progressColor;
    progressTimer = setTimeout('progress_update()',progressInterval);
    }
    function progress_stop() {
    clearTimeout(progressTimer);
    progress_clear();
    }
    progress_update(); // start progress bar
    </script>

Bookmarks

Posting Permissions

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