ページ遷移にアニメーション効果を実装する『Animsition.js』が『jQuery3.x』で動かない時の対策 UZUREA編集部 公開:2018年10月4日(6年前) / 更新:2020年8月24日 コメント 0件 Web技術htmlJavaScriptjQuery SNS X Facebook B! はてブ Pocket 当記事の内容および記事中のリンクには、広告目的や当サイトが収益を得るためのものが含まれており、これらの収益によってuzurea.netは運営されています。 Webサイトのページ遷移時にさまざまなアニメーション効果を実装できる、jQueryプラグイン、『Animsition』。 簡単設置でき、多彩な機能でwebサイト構築時には重宝していましたが、同プログラムのオフィシャルコミットは2016年の4月(参考)。 残念な事に、最新のjQuery3.x系では動作しません。素直に他のプラグインを実装するのも良いですが、諸事情で使い続けざるを得ない状況になり、対策をみつけましたので覚書。 記事の索引1 Animsition doesn’t work with jQuery 3.1.12 ……対応版は下記からダウンロード3 まとめ Animsition doesn’t work with jQuery 3.1.1 ……という記事をgoogle先生が提示してくれたので、早速確認。 Animsition doesn’t work with jQuery 3.1.1 https://github.com/blivesta/animsition/issues/111 なるほど、なるほど…… 2017年2月のスレッドですが、質問者はだいたい同じこと言ってますね。 で、3つ目の返信で『max-ci』さんが、プログラムの修正案を提示し、その後の返信を見る限り、皆さん喜んでるので、どうやら解決できそうです。 ……で、記載のアドレスに飛ぼうとしたら404。 githubの404は可愛い。でも癒され……ない! あーアカウント削除したのかなー。再度暗礁に乗り上げるのかなーなどと思いつつ再度、先ほどのスレッドをチェックすると、解決コードの投稿者へのお礼の投稿は『@makshh』と書かれている。 だけど、フォーラムでの投稿者名は『@max-ci』となっているので、なるほどgithubのアカウント名を変更しているという訳でした。 ……という訳で、リンク先のURLを現在のアカウント名にあわせて https://gist.github.com/max-ci/a1c72ce33dda1f56616d870b098ec726/revisions?diff=split としてにアクセスすれば同氏による修正コードの提示へ無事アクセスできました。 ……対応版は下記からダウンロード そんな訳で、 max-ci氏による Animsition.js jQuery3.x対応コードはこちら。 公式のgitにコミットしてくれればいいのに…… もちろん、ダウンロードしたanimsition.jsを読み込ませてたところ、jQuery3.x系でも無事動作する事も確認しました。 ありがとうmax-ciさん。 まとめ 関連リンクを下記へ記載しておきます。 Animsition 公式サイトAnimsition GithubRevisions · aimsition.js (by max-ci) 本件とは直接関係ありませんが、私達webに従事する人間は、もう少しデータのアーカイブについて真剣に考えた方が良いように感じています。 Infoseek、Cool、そしてGeocitiesといった無料webスペースのサービス終了に伴い、次々と失われて行く情報。他にも、閉鎖やリニューアルで失われていってしまう、URLや情報達。 そんな事について、あらためて色々と考え直した次第です。 jQuery入門道場 ¥1,250 (2024/11/21 01:47:30時点 Amazon調べ-詳細) Amazonでのレビューを見る Kindle Amazonで探す 楽天市場で探す Yahoo!ショッピングで探す メルカリで探す わかばちゃんと学ぶ Git使い方入門 ¥2,208 (2024/11/21 09:36:28時点 Amazon調べ-詳細) Amazonでのレビューを見る Kindle Amazonで探す 楽天市場で探す Yahoo!ショッピングで探す メルカリで探す イラスト図解式 この一冊で全部わかるWeb技術の基本 ¥1,663 (2024/11/21 09:36:28時点 Amazon調べ-詳細) Amazonでのレビューを見る Kindle Amazonで探す 楽天市場で探す Yahoo!ショッピングで探す メルカリで探す