Link to home
Start Free TrialLog in
Avatar of blink10
blink10

asked on

Help needed for facebook like auto load results on scroll

Ok here is the thing,
We implemented facebook like results page. I mean results loading on the same page rather than using pagination.
Now the problem here is the user need to click manually "show more" link to load more results.
But we need the results load automatically when the user reach bottom of the results everytime.
This is our site url.
Billsprice product search

This is the tutorial we used
http://www.webspeaks.in/2010/05/facebooktwitter-like-load-more-results.html
Avatar of yeelokhk
yeelokhk
Flag of Hong Kong image

You can use jQuery.scroll event to detect whether is reaching the bottom of your page. Then, you can call the function you have implemented for the "Load More" button

One example is here (in other's question): http://stackoverflow.com/questions/2837741/jquery-detecting-reaching-bottom-of-scroll-doesnt-work-only-detects-the-top
Avatar of blink10
blink10

ASKER

Ok i see this code.
$(window).scroll(function(){
        if  ($(window).scrollTop() == $(document).height() - $(window).height()){
           lastPostFunc();
        }
});

Open in new window

in this page http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/

Could you please tell how to integrate that code with this code?

http://www.webspeaks.in/2010/05/facebooktwitter-like-load-more-results.html
$(window).scroll(function(){
        if  ($(window).scrollTop() == $(document).height() - $(window).height()){
           $('.more_updates').click();      // to invoke the click event of loading updates
        }
});

Open in new window

Avatar of blink10

ASKER

Ok almost there, how can i make it start loading prior to bottom of the page.

I need it to load when the user has scrolled half way down the page.
Just modify the if-condition

$(window).scroll(function(){
        if  ($(window).scrollTop() == ($(document).height() / 2) - $(window).height()){
           $('.more_updates').click();      // to invoke the click event of loading updates
        }
});

Open in new window

Avatar of blink10

ASKER

Its not working
ASKER CERTIFIED SOLUTION
Avatar of yeelokhk
yeelokhk
Flag of Hong Kong image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of blink10

ASKER

Awesome