If you’re a front-end developer working with SASS/CSS, chances are you’ve had to add elements with horizontal scrolling on them. These have become increasingly popular as native scrolling promotes good UX practice and accessibility. The issue is, Safari (and Chrome, Firefox etc) on iOS don’t natively support ‘momentum scrolling’. The same is true of vertical scrolling on items with overflow: scroll too.
In this tutorial, I’ll show you how to add animated back to top button with CSS and jQuery to your website. This light-weight approach will enhance usability with a back to top button whilst making use of hardware-accelerated animation as all animations will be handled by native CSS3 properties.