Skip to content

Instantly share code, notes, and snippets.

@fredkingham
Created October 2, 2012 11:27
Show Gist options
  • Save fredkingham/3818315 to your computer and use it in GitHub Desktop.
Save fredkingham/3818315 to your computer and use it in GitHub Desktop.
knockout infinite scrolling
ko.bindingHandlers.scroll = {
updating: true,
init: function(element, valueAccessor, allBindingsAccessor) {
var self = this
self.updating = true;
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$(window).off("scroll.ko.scrollHandler")
self.updating = false
});
},
update: function(element, valueAccessor, allBindingsAccessor){
var props = allBindingsAccessor().scrollOptions
var offset = props.offset ? props.offset : "0"
var loadFunc = props.loadFunc
var load = ko.utils.unwrapObservable(valueAccessor());
var self = this;
if(load){
element.style.display = "";
$(window).on("scroll.ko.scrollHandler", function(){
if(($(document).height() - offset <= $(window).height() + $(window).scrollTop())){
if(self.updating){
loadFunc()
self.updating = false;
}
}
else{
self.updating = true;
}
});
}
else{
element.style.display = "none";
$(window).off("scroll.ko.scrollHandler")
self.updating = false
}
}
}
@jkrizanic
Copy link

How can I detect that scrolling has stopped and then call the loadFunc() ?

@dirq
Copy link

dirq commented Sep 20, 2016

How can I defer the scroll event so it doesn't fire so much?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment