jQuery：offsetを使ったnavのスムーススクロールの実装

Question

こんにちは、
jQuerydでoffsetを使ったナビゲーションのスムーススクロールの実装をしようとしているのですが、
”Cannot read property 'top' of undefined at HTMLAnchorElement.”
のエラーメッセージがでてきます。

アドバイスよろしくお願いします。

    <header id="header">
        <div class="container">
            <p id="logo">xxx</p>
            <nav>
                <ul id="gnav">
                    <li><a href="#about">ABOUT</a></li>
                    <li><a href="#service">SERVICE</a></li>
                    <li><a href="#work">WORK</a></li>
                    <li><a href="#contact">CONTACT</a></li>
                </ul>
            </nav>
        </div>
    </header>

$('#gnav a').click(() => {
    var elm = $(this).attr('href');
    var pos = $(elm).offset().top;


    $('html, body').animate({
        'scrollTop': pos
    }, 500); 

    return false; 
});

Answer 1

.click(() => { -> .click(function() {

thisを使うならアロー関数は使わないようにしましょう。（もしくはイベントオブジェクトを受け取って使う）

【event.target | jQuery API Documentation】
https://api.jquery.com/event.target/

Comments

[Kinomaru]

そうなんですね！
実は、色々試していた中で...
thisが加わると動作しないのも気になってました。
２つの疑問が一気に解決して助かりました！

おかげさまで、うまく動くようになりました。
ありがとうございます！！