4

In the sample below, I am developing app for TV, where window size is fixed. What I want is to use left right buttons to scroll the div cells. Since I will have thousands of items, I wanted to reuse fixed amount of cells. So as I moving forward through data array, I am moving the window and deleting/adding cells. In the sample below I only started to implement right scroll. The cell movement should be animated. As you can see, everything is fine, until I am deleting/adding cells (cell d1 to e1). Then it's automatically scrolling and I can't animate the scroll. 

var cellToDelete = data[windowStart];
var cellToAdd = data[windowStart + WINDOW_SIZE];
windowStart++;
currentCellIndex++;
$('<div></div>').html(cellToAdd.text).addClass('cell').attr('id', cellToAdd.id).insertBefore("#dummy0");
$("#" + cellToDelete.id).remove();

How can I prevent auto scroll and animate scroll in that case?

JSFiddle

Pablo
  • 28,133
  • 34
  • 125
  • 215
  • Does this answer help you at all? http://stackoverflow.com/questions/9834143/jquery-keep-window-from-changing-scroll-position-while-prepending-items-to-a-l – Marie Feb 14 '17 at 16:55
  • Not sure if I can correlate the answer with my particular case... – Pablo Feb 14 '17 at 19:45
  • The problem in my case happens when I remove first off-screen element, then divs are shifting thus shifting/scrolling the rest of the divs. Not sure if I am on the right track with my approach of re-using divs with large amount of data. – Pablo Feb 14 '17 at 20:26

0 Answers0