Some of the most inspiring examples I’ve seen of front-end development have involved some sort of page transitions that look slick like they do in mobile
swup — Versatile and extensible page transition library for server-rendered websites
Versatile and extensible page transition library for server-rendered websites
AutoAnimate - Add motion to your apps with a single line of code
A zero-config, drop-in animation utility that automatically adds smooth transitions to your web app. Use it with React, Solid, Vue, Svelte, or any other JavaScript application.
page-transitions.style — Bringing back Internet Explorer’s Page Transitions
Bringing back Internet Explorer’s Page Transitions thanks to the View Transition API
Whimsical Animations
Learn how to create charming interactions and delightful touches using the magic of CSS, JavaScript, SVG, and Canvas. I’m sharing all my tricks in this one!
Bringing Microsoft Internet Explorer’s proprietary “Interpage Transitions” back to Modern Browsers using the View Transition API
Back in late 2024, I started working on a fun end-of-year side project named ie-page-transitions. It”s a CSS + JS library that brings back Microsoft Internet Explorer’s proprietary “Interpage Transitions” to modern browsers, powered by the View Transition API. After sitting unfinished for a while, I finally got all 23 classic effects over the finish line and published the project on page-transitions.style.
Bringing Microsoft Internet Explorer’s proprietary “Interpage Transitions” back to Modern Browsers using the View Transition API
Back in late 2024, I started working on a fun end-of-year side project named ie-page-transitions. It”s a CSS + JS library that brings back Microsoft Internet Explorer’s proprietary “Interpage Transitions” to modern browsers, powered by the View Transition API. After sitting unfinished for a while, I finally got all 23 classic effects over the finish line and published the project on page-transitions.style.
Homepage
Supported by Webflow. Animate Anything - A wildly robust JavaScript animation library built for professionals.
Homepage
Supported by Webflow. Animate Anything - A wildly robust JavaScript animation library built for professionals.
Cross-Document View Transitions: The Gotchas Nobody Mentions | CSS-Tricks
This is Part 1 of a two-part series about cross-document view transitions, going over all the gotchas, from ditching the deprecated way to opt into them to a little-known 4-second timeout.
Animating CSS Grid Layouts with CSS Anchor Positioning
At CSS Day (back in June), someone asked me how Brave (the browser) might have built their New Tab Page which features some tiles laid out in a grid. While the grid is nothing spectacular, something special happens with it when you resize the viewport: as the available space changes, the grid nicely reorganizes itself in an animated way. The animations are also interruptible, so no View Transitions seem to be at play.So, how did they do it? I’m not sure. But if I were to recreate it, I’d use CSS Anchor Positioning with regular CSS Transitions on top.
Carousels with CSS | Blog | Chrome for Developers
Support scroll experiences with navigation buttons and markers with just a few lines of CSS.
The HTML presentation framework | reveal.js
Documentation and demos for the open source reveal.js HTML presentation framework.
bramus/ie-page-transitions
Bringing back Internet Explorer’s Page Transitions thanks to the View Transition API
animate with dermot - home
animation and design tutorials, tradition hand-drawn, but also puppet based animation with Flash, AnimateCC, Harmony
Anime.js | JavaScript Animation Engine
A fast, multipurpose and lightweight JavaScript animation library
Firefox OS, Animations & the Dark Cubic-Bezier of the Soul – Mozilla Hacks - the Web developer blog
I’ve been using Firefox OS daily for a couple of years now (wow, time flies!). While performance has steadily improved with efforts like Project Silk, I've often noticed delays in ...
