Posted By

FatFolderDesigner on 01/23/11


Tagged

ajax javascript content


Versions (?)

Who likes this?

12 people have marked this snippet as a favorite

tlongren
o0110o
maltem
julianrhyswilliams
matylla
virendrakryadav
dubogii
banjomamo
adokara2
summer_charlie
mb2o
Priestd09


Simple Content Load on Scroll


 / Published in: jQuery
 

URL: http://fatfolderdesign.com/173/php/content-load-on-scroll-with-jquery

Simple jQuery script to load additional content when you near the bottom of the page, same sorta thing Twitter does (although I originally programed it for a different use). Only thing of remark is the fact that it stores the current highest loaded value in a hidden variable, that way, fi the scrip dies or the user does not ave javascript enabled you can use that variable to load the next set of content up through traditions POST/GET methods.

I also have a version of the script that does not use jQuery if anybody is interested (although it is much larger and not as smooth).

Example is available at the link.

UPDATE: A commenter (on my site at the link) noted that there was a problem with the Content load on Scroll with jQuery example in Firefox 5 for windows and linux, and before I could even get off work to take a look he posted a fix.

The problem has to do with the browsers cacheing system. When you reload the page it keeps the cached value of the hidden input that keeps track of how far you’ve scrolled, so when you reloaded it would display the initial 50, then jump to wherever you were. The solution is simple, you just need to reset that value once the page is loaded, so that it will overwrite any cached data your browser may be using. The code he posted is as simple as it gets and has been added to the source. You could also fix this by playing with how browser cache your site, but since they usually get the right this seems like a better solution to me.

Report this snippet  

You need to login to post a comment.