Hammering away at a project at work, my fellow front-end colleague runs into a requirement where he needs a horizontal scroller. “They want Netflix style scrolling” he told me. He asked how I would implement it but at the time I was busy so I couldn’t really help him.

One thing different about our desired scroller is that instead of “chunked” they wanted “continuous” scrolling. Damnit. Chunked scrolling would be easy since there is a clear definition of state: you see one set videos, click next, then you see the next set. There is no clear state in continuous scrolling. This meant you can’t just use CSS animations to scroll the content. Oh lord, are we back to JavaScript animations?

I’m not sure if my colleague ever got to the ticket, but he did ask me for my implementation and my brain has been spinning since. Below is a quick JavaScript implementation I put together.

This implementation uses Velocity.js because it’s supposed to be the bomb. Personally, I’m not a huge fan of horizontal scrollers.

Endless Horizontal Scroller Demo
Code on Github