Displaying 1 to 8 from 8 results

smoothState.js - Unobtrusive page transitions with jQuery.

  •    CSS

smoothState.js is a jQuery plugin that progressively enhances page loads to give us control over page transitions. If the user's browser doesn't have the required features, smoothState.js fades into the background and never runs. Below are some cool sites built with smoothState.js. Feel free to submit a pull request with your own site, or tweet me with a link.

page-transitions-travelapp - Travel App, Native-like Page Transitions

  •    Vue

This demo shows an example of how to acheive native-like page transitions on the web. There's much to be improved here- it's not meant to be a full-fledged web application, just a quick demo to show how this kind of implementation could theoretically work. These concepts can and should be expressed differently in your own application, the sky's the limit here! This is created with Nuxt and Vue. For detailed explanation on how things work, checkout the Nuxt.js docs.

swup - CSS transitions between website pages.

  •    Javascript

Animated page transitions with css. Note: In case you like to do your animations in JavaScript, you may also check out swupjs.

nuxt-type - Small demo showing custom page animations with a fake typography site

  •    Vue

Small demo showing custom page animations in Vue 2 with a fake typography site, currently using a custom build of Nuxt, pre 1.0.0beta release. Using GreenSock for the animations, including SplitText. Nuxt.js is a framework for creating Universal Vue.js Applications. It presets all the configuration needed to make your development of a Vue.js Application Server Rendered more enjoyable.

yubaba - is an element to element animation orchestrator for React.js ✨

  •    TypeScript

Complex page transitions are becoming more common on the web but we're still at a point where we need to write a lot of boilerplate to make it happen, worse yet disjointed parts of our apps needing to know about each other to make it all work. Yubaba tries to solve this by allowing disjointed parts of your app define what animations they want to happen when a matching partner is found, without explicit knowledge of each other.

lookforward - A small library that helps you to create smooth transitions between pages with the easiest way

  •    Javascript

A small library that helps you to create smooth transitions between pages with the easiest way

swupjs - JavaScript transitions between website pages.

  •    Javascript

Swupjs is an extension of swup, which modifies the module for use with JavaScript animations. Swupjs only slightly modifies swup, where all the capabilities of swup remain the same, with only one exception - timing and animations are based on JavaScript, not CSS transitions. For more information about functionality and idea of swupjs, refer to swup documentation.

hy-push-state - Turn static web sites into dynamic web apps.

  •    Javascript

hy-push-state is a web component that lets you turn web pages into web apps. The component dynamically loads new content (formerly known as "ajax") and inserts it into the current page, without causing Flash of White, Flash of Unstyled Content, etc. hy-push-state is similar to pjax and smoothState, but offers a more advanced pre-fetching logic and gives you more control over its internals to enable advanced page transition animations.