Question

very easily we can detect when user scroll and then we can load next data into div something like below.

$( "body").scroll( function() { 
if (document.elementFromPoint(x,y) == $("#whatever")) { 
  $( "#myDiv").load( "test.html");
}

}

my now my scenario is different. i will show single data in page which is itself a big.
when i am showing single data from my db then user has to scroll a lot because my single data cover 3-4 pages. so if user need to read whole data then he has to scroll 3-4 pages and need many scroll. so is there any way that i can show partial of a huge data in a page and when user scroll then i will load again partial data into page and in this way i can load data the way user scroll down. please looking for suggestion.

Answer 1

My suggestion would be to use a 3rd-party tool like e.g. DevExpress XtraGrid.

They have kind of virtual scrolling/paging, I think this is similar to what you want to have.

Using an out-of-the-box component usually saves you from developing and debugging such a (possibly) complex task.

Drawbacks would be that by using a 3rd-party library, your pages generally would get more “bloated” (more CSS, more JavaScript, bigger).