I'm using EndlessScroll function of https://github.com/fredwu/jquery-endless-scroll.
I have a problem, I want to disable the endless scroll when scroll goes up, but I don't know how. I want to Cease Fire only when an Array is traversed with a pointer (I have a preloaded array).
Note: - i is a counter - times are the number of items loaded - tam is the length of the array
data = [. . . . . . . . ]
tam = data.lenght();
i = 0;
items = 10;
$('#ul-container').endlessScroll({
fireDelay: 1,
loader: '',
insertAfter: '#ul-container li:last',
insertBefore: '#ul-container li:last',
ceaseFireOnEmpty: false,
ceaseFire: function(j, p) {
if (i >= tam) {
return true;
}
},
content: function(j, p) {
var times = 0;
if (p>0) {
if (i < tam) {
to_return = "";
while (i + times < tam && times < 10) {
to_return += "<p>" + (i + times).toString() + " " + data[i + times]["id"]
+ ": " + data[i + times]["text"] + "</p>";
times++;
}
i = i + times;
console.log(i);
//$('#ul-container').append(to_return);
return to_return
}
}
}
Whenever I scroll up I get 'undefined'. When I scroll down I get 10 items from the array (or the items that are left). And when the array is already displayed, it stops scrolling.
Just to illustrate, this endlessScroll is inside an Ajax call. I'm using Django to get the data from a database, and then, load them to a and display them.