トップへ戻るボタンが表示されない!jQueryのエラーが出たらどうすればいい?


目次

トップへ戻るボタンが表示されない

トップへ戻るボタンが表示されない

jQueryでスムーズスクロールを設定していました。
下へスクロールするとトップへ戻るボタンが表示され、クリックするとスルーっと上へあがっていくアレです。

トップページに実装した時は通常通りエラーも出ずスルーっと動いてくれていましたが、他のページに実装したらボタンが表示されず、以下のエラーメッセージが!

▼エラーメッセージ

Google翻訳さんによるとどうやら「未定義のプロパティ ‘top’を読み取ることができません」と言っているようです。
困りました。

エラーが出たjQueryコードは以下の通り。

▼エラーが出たコード

この中の「offset().top;」という記述に問題があったようで、以下のコードに書き換える事で解決しました。

▼以下のコードに置き換えると解決。

参考サイト

https://stackoverflow.com/questions/20175094/uncaught-typeerror-cannot-read-property-top-of-undefined

jQueryが使えなかった場合の対処法

スルーっと上へ上がる動きを諦めるかと一瞬頭をよぎりましたが、意外とすんなり解決できて良かったです。
備忘録として残しておきますので同じエラーが出た方の解決策になれば幸いです。
また、もっとスマートなやり方があれば教えてください。


カテゴリ:
タグ: