Skills
.Work. You
Rest

webflow-page-transitions

Community

Smooth Webflow navigation with Taxi.js.

Software Engineering#debugging#animations#page transitions#module lifecycle#webflow#taxi.js#frontend navigation
AuthorBamoJ
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This skill helps you implement reliable, polished client-side page transitions in Webflow so animations and module lifecycles stay consistent across navigation.

Core Features & Use Cases

  • Taxi.js lifecycle integration: Coordinates onLeave → transitionOut → onPageOut and onEnter → transitionIn → onPageIn → onMount so exit/enter animations and setup/teardown happen in the right order.
  • Module hook-driven transitions: Enables modules to run entrance/exit behavior using onPageIn and onPageOut, including promise-based waiting to ensure animations complete.
  • Webflow-specific configuration & control: Uses data-taxi-ignore to skip specific links and relies on the transition manager in src/lib/pages.ts for global behavior like scrolling to top.

Quick Start

Ask the AI to show you how to add an onPageIn entrance animation and an onPageOut exit animation in a module so Taxi.js runs them correctly during cross-page navigation.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: webflow-page-transitions
Download link: https://github.com/BamoJ/wf-starter-fed-v1/archive/main.zip#webflow-page-transitions

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.