Skip to content

Directional view transitions for intuitive navigation. ⭐️ Please star to support this work! ⭐️

Notifications You must be signed in to change notification settings

vtbag/turn-signal

Repository files navigation

⭐️Please star to support this work⭐️

🔙 The Turn Signal

Turn-Signal: Directional view transitions for intuitive navigation.

Build Status npm version minzip NPM Downloads

The @vtbag website can be found at https://vtbag.pages.dev/

!!! News !!!

Transition types and direction attributes are now also determined on the old page!

For details see the CHANGELOG and the documentation.

What is it?

Turn-Signal is a lightweight script that enhances cross-document view transitions by detecting the direction of browser navigation. It enables developers to create smooth, responsive transitions that adjust based on forward or backward navigation, delivering a more intuitive user experience.

When your pages slide to the left on forward navigation, let them slide to the right when the users goes back in the browser's history.

The script automatically detects the traversal direction and sets backward, neither or forward view transition types accordingly. You can also instruct the script to set data attributes on the <html> element.

If your site has the concept of a previous and next page, the Turn-Signal can automatically generate directional transitions for you.

See the Turn Signal in action and see how it can be customized.

About

Directional view transitions for intuitive navigation. ⭐️ Please star to support this work! ⭐️

Topics

Resources

Stars

Watchers

Forks

Sponsor this project