ブログ型ホームページ制作ならWebma! 制作費無料、月額格安。無制限フォローと強力なSEO、そしてアクセス解析レポートも毎週提供の集客できるホームページ制作サービス
お気軽にお問い合わせください。
0120-980-939
受付時間 10:00~18:00(土・日・祝日除く)
公開日:2017年6月22日

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

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

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

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

▼エラーメッセージ

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

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

▼エラーが出たコード

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

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

参考サイト

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

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

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

この記事の著者

多胡祐子
多胡祐子
Webma!チーム デザイナー
記事一覧

PR

engage




著者一覧

多胡祐子
多胡祐子

Webma!チーム デザイナー

渡邉清子
渡邉清子

Webma!チーム デザイナー

増子貴仁
増子貴仁

Cross&Crown LLC代表社員、Cross&Crown Security Intelligence LLC代表社員。