splitting up image loads from rest of page

Skip to first unread message

Larry Martell

Sep 28, 2012, 3:48:28 PM9/28/12
to django...@googlegroups.com
I have a template that creates a table that has clickable links. It
also loads a bunch of images associated with each row in the table.
Through javascript events, when the user mouses over certain fields,
the images are displayed or hidden. Initially, all the images are not

When the page loads, the table is produced quickly, but then there's a
period of time before you can click on the links or mouse over and see
the images. How long that period of time is seems directly related to
how many rows there are in the table, so I'm assuming that time is
being spent loading the images. Would that be a correct assumption?

Assuming my assumption is correct, is there a way I can some how split
this up, so the clickable links work as soon as the table is rendered,
without waiting for the images? Also, the client is asking for me to
display '... loading images' which goes away once they are all loaded.
Can anyone tell me how I could do that?



Sep 28, 2012, 3:52:58 PM9/28/12
to django...@googlegroups.com
Checkout the jquery lazy load plugin [http://www.appelsiini.net/projects/lazyload]. I'm sure you can use it to achieve what you want.

Minor advice, this doesnt exactly relate to django, may be SO or some other js forums / groups would be a better place to post this?
You received this message because you are subscribed to the Google Groups "Django users" group.
To post to this group, send email to django...@googlegroups.com.
To unsubscribe from this group, send email to django-users...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/django-users?hl=en.

Larry Martell

Sep 28, 2012, 3:54:49 PM9/28/12
to django...@googlegroups.com
On Fri, Sep 28, 2012 at 1:52 PM, aziz....@gmail.com
<aziz....@gmail.com> wrote:
> Checkout the jquery lazy load plugin [http://www.appelsiini.net/projects/lazyload]. I'm sure you can use it to achieve what you want.

Thanks. I'll check it out.

Giuseppe caruso

Sep 28, 2012, 5:10:21 PM9/28/12
to django...@googlegroups.com
Also, use pagination to split your content in several pages. Google "django pagination".

Larry Martell

Sep 29, 2012, 7:53:05 PM9/29/12
to django...@googlegroups.com
For the archives:

What I did was to move the code that handles the clickable links into
a $(document).ready block (it was in a window.onload block). This
seems to be working fine for me - the links are active before the
images are loaded.

For the other part of this task (display '... loading images' which
goes away once all the images are loaded), I created the text with
display: none, then when the page is created I show() it, and in the
window.onload function I hide it. This also seems to be working fine.
Reply all
Reply to author
0 new messages