BLOGブログ

2023/03/17

JQueryによるアニメーション

スクロールすると要素がふわっと表示されるアニメーションをJQueryで実装していたサイトで発生した問題です。

id指定をしてページの途中に遷移するようにした場合に、アニメーションで表示されるはずの要素が表示されずページが真っ白で表示されることがありました。
少しでもスクロールすると表示されるのですが、ページ遷移後ページに何も表示されないと焦りますよね。
その挙動はブラウザーによって異なり、Google Chromedでは移後クスロールしなくても要素が表示されていたのですが、Microsoft Edgeでは要素がすぐに表示されるときとスクロールしないと表示されないときと様々、、、Firefoxでは100%ページが真っ白に。。。
JQueryスクロールイベントの実行範囲がブラウザーによって異なるのでしょうか?

とりあえず、ページ遷移したときにJQueryでページトップからid指定の場所までスクロールさせることで、どのブラウザーでもページ途中への遷移後もきちんと要素が表示されるようになりました。

CONTACTお問い合わせ

サービスに関するお問い合わせやお見積もり・ご相談などお気軽にご相談ください。

電話でのお問い合わせ

受付時間(平日)09:00~18:00
※年末年始・祝日を除く

メールでのお問い合わせ

24時間受付