0

I was able to implement infinite scrolling into my Django website's home page following this guide: https://simpleisbetterthancomplex.com/tutorial/2017/03/13/how-to-create-infinite-scroll-with-django.html

Basically the Jquery code that triggers the infinite scroll is this (plus some django code):

<script>
  var infinite = new Waypoint.Infinite({
  element: $('.infinite-container')[0]
  });
</script>

This is good because I load the page pretty quickly and the user is then able to infinite scroll as the other elements load. What I want to achieve now is to load the page like I do now and immediately after, without the need of scrolling down, I want to load the rest of the elements. So basically load the page with the first few elements and then load all the remaining elements without having to scroll. Note that I have used the above guide's implementation as it is a convenient way of being able to use all of Django's power (especially related to foreign keys), so I am trying to stick to this approach.

Is there a way to do so changing the what the Jquery is triggered only?

Thanks, Vittorio

vittorio somaschini
  • 67
  • 3
  • 8

1 Answers1

0

Waypoint.Infinite is a lib you should be reading docs for. Assuming loading is triggered on reaching bottom, you can just scroll to bottom with Jquery on page load.

$('html, body').scrollTop($(document).height());

Kyryl Havrylenko
  • 674
  • 4
  • 11
  • Thanks for your answer, but I want it to "silently" load those elements. So basically, while the user sees the initial page, the bottom elements need to be loaded silently. – vittorio somaschini Mar 19 '19 at 12:21
  • i don't see a way to trigger load event in your front end lib docs; maybe try asking in their github issues how to do it. Or just implement it with jquery, all you need to do is trigger ajax on each scroll to the bottom, honestly, don't think you need a dependency to do so. – Kyryl Havrylenko Mar 19 '19 at 14:57