Load parts of a page as needed?

[CRON]

Hi!,
Anyone know a way to save on loading times by only loading part of the
page after a link is clicked? iframes is an obvious solution but it
would be messy. Is it possible to change the content of a div when a
link is clicked?
Cheers,
Ciarán

 

[J.O. Aho]

Hi!,
Anyone know a way to save on loading times by only loading part of the
page after a link is clicked? iframes is an obvious solution but it
would be messy. Is it possible to change the content of a div when a
link is clicked?

Yes, you can do that with help of javascript (even jscript works, but then you
lock out a good number of users)

--- javascript ---
function showdiv(id)
{
el = document.getElementById(id);
if (el.style.display == 'none') {
el.style.display = '';
el = document.getElementById('_' + id);
} else {
el.style.display = 'none';
el = document.getElementById('_' + id);
}
return false;
}
--- eof ---

--- the div ---
<div id="divID">Something here!</div>
--- eof ---

--- the link ---
<a href="" title="The Link" onclick="javascript:showdiv('divID');return
false;">The Link to show or hide div named divID</a>
--- eof ---

Should work on all javascript supporting browsers.

 

[CRON]

Cool thanks for the quick reply - I'll check it out.

 

[CRON]

Aho,
Thanks for the effort but this script isn't quite what I wanted. The
display:none css property doesn't actually prevent the content from
loading, it just hides it from the user. I need something that works
like this that does not load the new content until the link is clicked.


The reason for this is my page is very long and complicated and I am
trying to stagger the loading time of the content. I cannot split the
page into new pages.

Anyone else have an idea?
Thanks Ciarán

 

[J.O. Aho]

Thanks for the effort but this script isn't quite what I wanted. The
display:none css property doesn't actually prevent the content from
loading, it just hides it from the user. I need something that works
like this that does not load the new content until the link is clicked.

Okey, then you have to go with AJAX and some serverside scripting and use
javascript to write out portion of the text. You will get a load of work to
get roughly the same effect as frame/iframe.

The reason for this is my page is very long and complicated and I am
trying to stagger the loading time of the content. I cannot split the
page into new pages.

Surely you can cut it up, I still haven't seen a book where you have only one
page.

 

[Jonathan N. Little]

Hi!,
Anyone know a way to save on loading times by only loading part of the
page after a link is clicked? iframes is an obvious solution but it
would be messy. Is it possible to change the content of a div when a
link is clicked?

No the obvious solution is break the page up! Too much on a page is bad
design. No one likes to enter a page and wait ten minutes as the "scroll
to China" is created.

 

[Toby Inkster]

Anyone know a way to save on loading times by only loading part of the
page after a link is clicked? iframes is an obvious solution but it
would be messy. Is it possible to change the content of a div when a
link is clicked?

AJAX is the obvious solution, but even better would be to split the file
into several pages and offer links like

<- previous page [page 2 of 14] next page ->

at the top and bottom of each page. People understand prev/next links like
this -- most search engines include them in results listings.

 

[CRON]

Thanks guys but it's not really as simple as that, The page doesn't
just flow down, I have a lot of dynamic content nested in popup forms
and things like that. For example, I have 50 smileys that load on every
page just in case a user decides to post a message. I'd like a way to
prevent these from loading before they are needed. That's just one
thing. My site has a lot of features that favour useability over
loading speed and I'm just trying to take some of the load times down a
little if I can.

 

[Andy Dingley]

Anyone know a way to save on loading times by only loading part of the
page after a link is clicked?

New page or navigation between related pages ?

If it's a whole new page, then try to re-design for a smaller, simpler
page. With today's coding practices and bandwidth, it's unusual to
require a page to be slow to load. If it's small enough to be
comprehensible in one chunk, then that's also technically light enough
to arrive speedily.

If it's navigation between related pages, or anything that suggests
itself as an iframe, then look into AJAX. Beware though that for simple
situations, the <iframe> solution is often simpler, better and doesn't
have problesm that a simple AJAX solution won't itself suffer from
(bookmarking in particular).

 

[Jonathan N. Little]

Thanks guys but it's not really as simple as that, The page doesn't
just flow down, I have a lot of dynamic content nested in popup forms
and things like that. For example, I have 50 smileys that load on every
page just in case a user decides to post a message. I'd like a way to
prevent these from loading before they are needed. That's just one
thing. My site has a lot of features that favour useability over
loading speed and I'm just trying to take some of the load times down a
little if I can.

If it takes lots of time then it is *not* usable! If page *needs* to be
so large, maybe your should think your overall design.