explaingit

blivesta/animsition

★ 3,793CSSAudience · developerComplexity · 1/5LicenseSetup · easy

TLDR

A jQuery plugin that plays a short CSS animation when visitors navigate between pages on a website, making page transitions feel smoother and more polished instead of appearing instantly.

Mindmap

mindmap
  root((animsition))
    What it does
      Animated page transitions
      CSS animations on links
      Smoother browsing
    How to add
      CDN script tag
      jQuery dependency
      Short init code
    Use cases
      Static HTML sites
      WordPress sites
      Portfolio pages
    Audience
      Web developers
      Designers
    License
      MIT permissive
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Add smooth animated page transitions to a static HTML website using a small jQuery plugin

USE CASE 2

Load animsition from a CDN and add a fade transition to a web page without downloading any files

USE CASE 3

Make a WordPress site feel more polished by installing the animsition WordPress plugin

Tech stack

CSSJavaScriptjQuery

Getting it running

Difficulty · easy Time to first run · 5min
Use freely for any purpose including commercial projects, as long as you keep the copyright notice (MIT license).

In plain English

Animsition is a small plugin that adds animated transitions between pages on a website. When a visitor clicks a link and moves from one page to another, instead of the next page appearing instantly, the transition plays a short CSS animation. This makes the browsing experience feel smoother and more polished. It is built as a jQuery plugin, meaning it depends on jQuery, which was a very common JavaScript library for websites. Adding it to a project involves including the animsition CSS and JavaScript files and then calling the plugin with a small amount of setup code. The project's website has a demo and installation instructions. The README is brief and does not go into depth about configuration options or what kinds of animations are available, but the project can be loaded from a CDN without downloading anything, which makes it straightforward to try in a web page. There is also a WordPress plugin built on top of it for sites running on that platform. The project has a small group of maintainers and contributors. It is released under the MIT license. The README does not mention whether the project is still actively maintained, and given that jQuery-based tooling has declined in use over the years, newer projects may not need this approach.

Copy-paste prompts

Prompt 1
I'm using animsition on a jQuery website. How do I configure it to use a slide-in animation when a visitor navigates between pages?
Prompt 2
Add animsition to an HTML page via CDN and set up a basic fade transition that triggers on every internal link click, show me the minimal code.
Prompt 3
I already have jQuery loaded on my site. Show me the smallest possible setup to initialize animsition for page transitions.
Open on GitHub → Explain another repo

← blivesta on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.