473,378 Members | 1,344 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,378 software developers and data experts.

Preloader...

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?
Jan 8 '07 #1
4 2532
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/
Jan 8 '07 #2
>
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!
Jan 8 '07 #3
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.visib ility="visible";
document.getElementById('loadingDiv').style.visibi lity="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?
Jan 8 '07 #4

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

Jan 8 '07 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: David | last post by:
Hi everyone, I am trying to stop an image preload sequence by the click of a mouse but have been unsuccessful trying several methods. Imagine this simple script below that loads 50 images to...
2
by: sean.f.duffy | last post by:
Hi! I am an effectivebrand.com toolbar user and would love to add a preloader to my toolbar, but am having problems doing this. Is it possible to have javascript look at the URL of a webpage,...
8
by: Ross | last post by:
This page I am trying to create a preloader that hides all the other content except the hidepage div until it loads...any ideas? Or any preloaders that actually work? ...
3
by: abm | last post by:
Hi. I am in great need of a preloader for my Flash web site. I have looked at a lot of tutorials and examples, but I can not seem to get it to work. How do I add a preloader to my existing Flash...
2
by: bedges | last post by:
okay, the scenario: i have a header image which changes randomly across all pages in the site. that works fine. i also have an image preloader within the random header picker which theoretically...
1
by: 031179 | last post by:
Hi I'm having lots of problems trying to apply a preloader to the following site: http://www.publishingme.com/niaomh/index.html I have tried different websites and tutorials but no luck....
0
by: Lanky | last post by:
I have noticed on sites that on a page a preloader will run and one or more flash movies will appear. Then the preloader does not reappear on subsequest revists to that page during the same browser...
2
by: streammalvern | last post by:
Hi, I am having a problem with a published Flash Movie. I included a preloader and the whole file size of the .swf is only about 1MB. If I go to the movie, it pauses even before the preloader...
3
by: 1left | last post by:
Hi- I'm getting some weird flickering of objects (not the preloader elements) during the "Simulate Download" test (56k) of my Flash 8 movie. I'm on cable modem , and the preloader runs so fast at...
0
by: deluxmilkman | last post by:
I'm trying to play flv on frame 1 after both flv and contents on frame 2 are loaded. how can I stop flv from playing before the contents are loaded? AS on frame 1
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.