- Scroll-triggered animations
Trigger an animation based on scroll position:
- https://info.internet.org/en/
- http://www.nurturedigital.com/work/pfister-react
- http://fantasy.co/work
- https://www.pumperlgsund-bio.de/de/
- http://us.rimmellondon.com/ (Perhaps This example uses scroll snap)
- http://tomerlerner.com/web/scroll/index.html#top (dito)
- http://graphicnovel-hybrid4.peugeot.com/start.html (AutoPlay)
Play an animation continually within a certain scroll range:
Animation stops playing once the scroll position leaves a certain range but continues to the end of the current iteration:
- http://www.dementialab.org/ (time-base animation is made by Flash!)
- http://www.dementialab.org/conclusion/ (time-base animation is made by Flash!)
- http://www.cabletv.com/the-walking-dead (Last slides)
- https://scrollrevealjs.org/
- https://ihatetomatoes.net/demos/one-page-scroll-animations/
- http://www.beoplay.com/products/beoplayh5#magnetic
Multiple scroll-ranges:
- http://www.exsus.com/highway-one-roadtrip (some animation related with wall clock)
- http://neomam.com/interactive/13reasons/ (Dit)
- http://pitchfork.com/features/cover-story/reader/savages/
- http://www.soleilnoir.net/believein/#/end
- Scroll-triggered style changes
- Scroll-linked animations
Scroll position controls progress:
- http://alfredservice.com/ (controls animation progress, even movie progress)
- http://www.flatvsrealism.com
- http://makeyourmoneymatter.org/
- http://www.dementialab.org/discovery-lab/
- http://lostworldsfairs.com/atlantis/
- http://everylastdrop.co.uk/
- http://www.madwell.com/work
- http://www.fannabee.com/
- http://www.culturalsolutions.co.uk/
- http://jason-kenny.com/
- http://lamoulade.com/#!/home
- http://www.nytimes.com/projects/2013/tomato-can-blues/?hp
- http://www.unfold.no/
- http://www.arnoldclark.com/challenge/
- http://cyclemon.com/
- http://www.bbc.co.uk/news/special/2014/newsspec_7617/index.html
- http://johnpeelarchive.com/joe-boyd/#TOOTS
- http://nasaprospect.com/
- http://allout.org/en/
- https://www.washingtonpost.com/graphics/sports/olympics/scale-of-the-olympics/?%3Ftid%3D=sm_pg&%3Ftid%3D=sm_pg (scroll → zoom)
- https://www.invisionapp.com/product-design-industry-report-2016
- Combination scroll and time-based animations