Archive for the ‘scrolling’ Category

Scrolling Letters Animation

Posted on: No Comments
Recently we’ve stumbled upon a really nice effect on Akademi’s website: the main title of the page moves along as one scrolls down and changes depending on the section that is currently in the viewport. We thought this would be an awesome e...

Scrolling Letters Animation

Posted on: No Comments
Recently we’ve stumbled upon a really nice effect on Akademi’s website: the main title of the page moves along as one scrolls down and changes depending on the section that is currently in the viewport. We thought this would be an awesome e...

Smooth Scrolling and Accessibility

Posted on: No Comments
Smooth scrolling (the animated change of position within the viewport from the originating link to the destination anchor) can be a nice interaction detail added to a site, giving a polished feel to the experience. If you don't believe me, look at how ...

Scrolling on the Web: A Primer

Posted on: No Comments
Scrolling is complicated. Nolan Lawson: User scrolls with two fingers on a touch pad User scrolls with one finger on a touch screen User scrolls with a mouse wheel on a physical mouse User clicks the sidebar and drags it up and down User presses up, ...

Pure CSS Horizontal Scrolling

Posted on: No Comments
The following is a guest post by Pieter Biesemans. Pieter is a front-end developer at Audience where he loves styling things with SCSS. He's going to dig into what I'd call a bonafide CSS trick. The web is a rather vertical place. You read a web site ...

A Priority+ Navigation With Scrolling and Dropdowns

Posted on: No Comments
The following is a guest post by Micah Miller-Eshleman. Micah designed a variation of the "Priority+ Navigation" concept and uses it in production at the college he works for. I always dig a show & tell behind the thinking and creation of a design patt...

AOS: CSS-Driven “On Scroll” Animation Library

The following is a guest post by Michał Sajnóg, a front end developer at Netguru. Michał has created one of those "when you scroll to here, trigger this animation" libraries. One of the things I like about it is that it leaves as much as it can to C...

How to Implement Smooth Scrolling in Vanilla JavaScript

Posted on: No Comments
Smooth scrolling is a user interface pattern that progressively enhances the default in-page navigation experience, animating the change of position within the scroll box (the viewport, or a scrollable element) from the location of the activated link t...