PDA

View Full Version : How to use jquery preloader



davelf
04-21-2011, 08:02 AM
Hi, i have no idea how to use it, is there any example that i can use. I see some of dynamicdrive, especially for image gallery, you used preloader.

So if i use it for ajax for example, can i use the preloader too?

And how the rules of loading in ajax? is it load every content at the first or it will load until we call it.

for example this website (http://www.indomie.com/)

if you click on heritage, ingredients, or quality & safety, i use ajax to call different HTML and place it there.
But may be because i'm using text not image, i don't see it loading.

Thanks in advanced:)

djr33
04-21-2011, 08:51 PM
I don't understand why you would want this. What you can do is much simpler than ajax. Include the information in the original source code. For example, use PHP includes, or SSI. Or you could even use Ajax onload.

Then just make the elements that will "load" be hidden. Click a "load" link and it will show the element. Switch between display:block; and display:none; for example.

Ajax is designed for loading NEW data while a page is available; by loading it early, that defeats the point. For example, think of an Ajax-based chat script: you want it to load a new version every time, not just preload the messages and never load it again.

Of course you might not need this feature, but then you don't really need Ajax either. What you want is just a dynamic page that has some elements hidden and they might become visible later.


One important note: if you want to "preload" multiple "ajax" elements at the same time, remember that each must have its own container element (such as a <div>). If the share a container, then only one set of content can exist.

If you use regular (non-pre-loading) ajax, then you can use one container, a div called "ajax" (id). Then just load the content into that.

But if you do that same approach with preloading (in any way-- serverside, ajax onload, etc.) then you will only keep the newest content in that container. So instead you will need one container per possible ajax page to load (pre-loaded separately). In other words, you'll need divs with ids "ajax1" "ajax2" and "ajax3".... and continuing until you have enough divs for each possible content.

Does that make sense?


If you want something to look for, think about Javascript tabs scripts. They don't all use Ajax and they "preload" all of the tabs.