Search code examples
javascriptpolymerpolymer-1.0web-component

how i do infinite scrolling by using polymer paper-scroll-header-panel?


i am using Polymer-1.0 paper-scroll-header-panel & looking auto-loading of content when user reach bottom (like facebook's infinite scrolling), the code given below working perfectly

listeners: {
"content-scroll": "scroll"
},

scroll: function(e, d){
console.log(e, d);
},

but how i know user reach bottom of page & is there any threshold setup available (like 80% from top) ?

in d.target' objectscrollHeight&scrollTop` are available, but i don't know how i use these value for infinite scrolling


Solution

  • scroll: function(e, d) {
        if (d.target.scrollHeight - (d.target.clientHeight * 1.5) < d.target.scrollTop) {
            // your code
        }
    }
    

    i don't know this is the right way but it will work, tested in chrome & firefox