[JSなし] パワーアップしたView Transitions APIでMPAをSPAみたいにする - Qiita

2024/06/09 30 users View Transitions 画面遷移 API MPA

2024年6月11日リリースのChrome126から、View Transitions APIがパワーアップし、別ページへの遷移でも使うことができるようになったので紹介したいと思います。 View Transitions APIとは View Transitions APIは、画面遷移をなめらかに行うことができる機能です。 この機能を使うと、以下の動画で紹介されているように... 続きを読む

CSSアニメーションがView Transitions APIで進化する！ パネルが伸び縮みしながら配置が入れ替わるお弁当箱みたいなデモ -Rediento

2023/07/26 32 users API CSSアニメーション 実装 デモ パネル

パネルがお弁当箱のように配置されており、各パネルをクリックすると伸び縮みしながら配置が入れ替わる、View Transitions APIを使用して実装されたデモを紹介します。 一昔前なら実装は面倒でしたが、Chrome 111から利用できるView Transitions APIにより簡単に実装できるようになりました。 Rediento -Bento Radio Gro... 続きを読む

View Transitions APIによるスムーズなページ遷移をNext.jsで簡単に試す

2023/04/16 20 users API View Transitions Next.js

はじめに こんにちは、ziと申します。 今回は、発表からしばらく経ってしまいましたが、View Transitions APIを使ったNext.jsでのスムーズなページ・UI遷移を目指して、実装してみます。 ※もし間違いやより良い実装方法など見つけましたら、ご指摘ください！ 🙇‍♂️ 今回実装した最終成果はこちらです。 また、コードはこち... 続きを読む