bower search sticky-position

No results

const nativeSupport = (function(){      
        if (this.isSupported !== null) {
            return this.isSupported;
        } else {
            const style = document.createElement('test').style;
            style.cssText = ['-webkit-', '-ms-', ''].map(prefix => `position: ${prefix}sticky`).join(';');
            this.isSupported = style.position.indexOf('sticky') !== -1;
            return this.isSupported;
        }
    }).bind({isSupported: null});

Wouldn't isSupported always be null, so wouldn't the else clause always be executed?

@jackmoore

Thanks for the help!
Thomas

Hey @jackmoore thanks for the great little pollyfill!

I have a slight problem with it - I am using a long container to stick a block of content to the page as you scroll down. Firefox's position: sticky will move down until the inner element (primary per your vernacular) hits the bottom of the wrapper, and then stops. In your implementation, the content keeps on going.

To illustrate, I've knocked up a quick jsbin, which you can visit here: http://jsbin.com/ruwokecofu/edit?html,css,js.

Here is how firefox (native position: sticky) handles that:

And here is chrome (your implementation):

Your code uses position: fixed which I think is most of the problem. I think a correct implementation here would use position: absolute and have to adjust the top on every scroll - until it reached the bottom of the container.

If you'd like @jackmoore - I can spend a bit of time working on a fix and PR it. If you're happy that I go forward with the suggestion outlined above.