kriscahya — 2010-07-15T00:50:59-04:00 — #1
is there any jquery that can handle page loader at the first time the webpage its click, my website consist of several jquery that will take time to view correctly so first time visitor will see it a bit messy, so i would like to cover it up with a loading animation untill all jquery files and css files finish loading from my webhosting server.
benzittlau — 2010-07-15T03:27:06-04:00 — #2
I would have to think about the element a bit, but off the top of my head I would try something like this.
In your css:
Then for the actual element, something like this:
Then I'd place the script tag at the foot of your document:
Some things might need to be tweaked a bit in the css, and in trying to have everything loads before the code runs, but hopefully this will give you somewhere to start.
kriscahya — 2010-07-15T03:10:46-04:00 — #3
Thanks for the reply, I'm not an expert in java coding, so I'm gonna need a bit more detail explanation hehe, so i just simply put this code on top of my other scripts ?
benzittlau — 2010-07-15T19:46:08-04:00 — #4
Scallio has a really good point...
The css would look like this instead:
And then in your markup you could put:
scallioxtx — 2010-07-15T11:56:50-04:00 — #5
kriscahya — 2010-07-15T10:22:43-04:00 — #6
whoa thanks I'll give it a try
benzittlau — 2010-07-15T02:51:10-04:00 — #7
You should simply be able to create an element which covers your page so the user can't see the loading happening behind it.
The trick will be timing the event which will hide this element. You can try simply do this in a $(document).ready function; which might be enough depending on how things in your site are layed out. I personally also try to define widths and heights of as many elements in a sites layout as possible, which prevents things from shifting around as the page loads.