jQueyをjavascriptに書き換えたい（特定の高さでclass付与）

Question

jQueyをjavascriptに書き換えたいのですが、よく方法がわからず困っています。

let $win = $(window),
$header = $('header');
$break = $('.message').offset().top;
showClass = 'is-show';

$win.on('load scroll', function () {
    let value = $(this).scrollTop();
    if (value > 766) {
        $header.addClass(showClass);
    } else {
        $header.removeClass(showClass);
    }
});

addClassは.classList.add
removeClassは.classList.removeを使うのはわかるのですが、
全体的な流れの書き方がわかりません。

よろしくお願いいたします。

Answer 1

全体的な流れの書き方がわかりません

全体的な流れはそのままでいいと思います。

気を付けた方がいいことは、window.scrollTopは存在しないのでwindow.scrollYを使った方がいいことと、offset().topと等価なプロパティがバニラにはたぶん存在しないことでしょうか。
（$break は定義してるだけで参照していない様子なので、問題ないかもしれないですが）

参考：
【 javascript / jQuery 】offsetTopとoffset().top - Qiita

Comments

[frankurin]

理解できました。
ありがとうございます。