Fake Loading Screen

What i want is a script that Shows loading then 3 full stops. but i want it to blink then 1 fullstop show up then another when all three are up i want it to do it again and again for about 10 times whilest all this is happing i would like a progress bar where every loop it moves 10 percent and it needs to show the percentage. I need this to work in
IE4+ and NN4+
LVL 1
dog3Asked:
Who is Participating?
 
cyberwizzConnect With a Mentor Commented:
I can do the script for you. Just want to clarify a few things.

Is it alright if images are used for the progress bar? Does it matter if frames are used? What timing cycle would you like? ie. 5 seconds for every 10%
0
 
dog3Author Commented:
Yes images are fine for the progress bar.
you can use frames but i have a image for a start up logo so i would like only two frames
Eg..

 A

----- Frame A has to be bigger than frame b
B

And about 5 secs for 10 percent.
i didn't mention this but when it has finished would i be able to have a imageor text link which sais "finished" then you click it and it will open index2.html and close the previous
window.



0
 
cyberwizzCommented:
Oh. I was thinking that I would use a smaller frame to put the "Loading..." part in. That way I could write to it and then refresh quicker. Is that alright? How big is your logo anyway?
BTW, the frames would be invisble.

Also after it is finished I can get it to load index2.html within that same window(full screen). That way another window does not need to be opened.
0
Cloud Class® Course: Microsoft Windows 7 Basic

This introductory course to Windows 7 environment will teach you about working with the Windows operating system. You will learn about basic functions including start menu; the desktop; managing files, folders, and libraries.

 
dog3Author Commented:
Yeah that is fine
I thought i woud give you some info on the site.
You see it starts off in the normal browser window which welcomes the visitor.
they click "go" which opens up a new window which has the loading screen.
it  has the logo (640*480) on it (if you havent guessed this is for 800*600)
and if you could make index2.html open in the same window full screen it would
be great.
Do the frames however you like.
0
 
cyberwizzCommented:
This is what I have working now. You are welcome to customise it youself or ask to to customise for you.

This goes in the index page. The frames are generated so no more files are needed.


<HTML>

<HEAD>
<SCRIPT>
<!--
var loadNum = 1;
var percentNum = 0;
var index = 0;
var emptyTop = '<HTML><BODY>';
var emptyBottom = '</BODY></HTML>';
var emptyFrame = emptyTop + emptyBottom;
var loading1 = emptyTop + '<P Style="font-size: larger">Loading..</P>' + emptyBottom;
var loading2 = emptyTop + '<P Style="font-size: larger">Loading....</P>' + emptyBottom;
var loading3 = emptyTop + '<P Style="font-size: larger">Loading.......</P>' + emptyBottom;
var emptyImages = emptyTop + '<IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG SRC="blank.gif">' + emptyBottom;
var percentImg = new Image();
percentImg.src = "test.gif";
//var showImg10 = emptyTop + '<IMG SRC="\'+percentImg.src+\'">' + emptyBottom);
function doLoading() {
   top.loading.location = 'Javascript:parent.loading'+loadNum;
//   alert(loadNum);
//   alert(percentNum);
   loadNum += 1;
   if (loadNum > 3) {
      loadNum = 1;
      percentNum += 10;
      top.display.document.images[index].src = percentImg.src;
      index += 1;
   }
   if (percentNum < 100) setTimeout("doLoading()",100);
   else top.document.location = index2.html;
}

// -->
</SCRIPT>
</HEAD>

<FRAMESET COLS="40%,60%" onLoad="doLoading()" FRAMEBORDER="0" BORDER="NO" FRAMESPACING="0">
<FRAME SRC="Javascript:parent.emptyFrame" NAME="blank" NORESIZE SCROLLING="no">
<FRAMESET ROWS="*,100" FRAMEBORDER="0" BORDER="NO" FRAMESPACING="0">
<FRAME SRC="Javascript:parent.emptyImages" NAME="display" NORESIZE SCROLLING="no">
<FRAME SRC="Javascript:parent.emptyFrame" NAME="loading" NORESIZE SCROLLING="no">
</FRAMESET>
</FRAMESET>
</HTML>



BTW, that's a big logo, won't it take a long time to download?
0
 
dog3Author Commented:
yeah the graphic will take long to load.

hmm on the page i was trying to preload it and you wern't able to go to the next page untill it was done but i never got it working.
0
 
cyberwizzCommented:
beedy, beedy beep.... translator fault...

Please explain, I don't think I understood.
Do you mean that this loading thing that I did for you was so that time is allowed for the image to preload?
0
 
dog3Author Commented:
one other problem it dosent work IE4 and netscape has a error.
forget about the preloading
0
 
cyberwizzCommented:
Please elaborate... what error in NN? What do you see in IE4?
0
 
dog3Author Commented:
NN:
JavaScript Error: file:/C|/WINDOWS/DESKTOP/index.html, line 41:

doLoading is not defined.
---------------------------------------------------------------------------------------------------------
JavaScript Error: file:/C|/WINDOWS/DESKTOP/index.html, line 15:

unterminated string literal.

      var emptyImages = emptyTop + '<IMG SRC="blank.gif"><IMG SRC="blank.gif"><IMG
...................................^
---------------------------------------------------------------------------------------------------------
IE:

Untermiated strind constant.
Line: 15
Char: 83

---------------------------------------------------------------------------------

Object expired
Line: 41
Char: 1
0
 
cyberwizzCommented:
For the "unterminated string" error make sure that everything is on one line. That's what I have and I get no error. That will also fix the other errors.
0
 
dog3Author Commented:
Wow that is realy good just what i wanted.

Do you have icq?
my UIN: 6953152
0
 
dog3Author Commented:
i have found that it dosent realy like going from the loading screen to index2.htm
0
 
cyberwizzCommented:
Sorry, I forgot to quote the followup page(index2.htm)

That line should read:

   else top.document.location = "index2.htm";
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.