barba.jsによる非同期通信によるページ遷移の検証ページです。

https://jungissei.github.io/barba.js

Functions

metaタグ書換処理

ページ遷移時にheadタグ内のmetaタグやogpタグなどを置き換えるようにしています。 非同期通信によるページ遷移は、指定のタグ以外のソースコードは置き換わらないためです。

ページ遷移アニメーション

ページ遷移時にjQueryによるフェードインアニメーションを追加しています。

アンカーリンク

クリックしたアンカーリンクのURLが現在のページと同一の時、ページ遷移させないようにしています。 また、スムーススクロールも追加しています。

Reference

https://irokoto.co.jp/blog/20220222/post-25 https://hibi-update.org/javascript/barba/ https://www.willstyle.co.jp/blog/3055/