$(function(){ $(window).on('scroll', function(){ // some event }); });

(() => { const clientHeight = document.documentElement.clientHeight; // ブラウザ表示領域 const target = document.querySelector('.hoge'); // 監視対象の要素 const header = document.querySelector('.header'); const observer = new IntersectionObserver((changes) => { // Intersection Observerの設定 for (const change of changes) { const rect = change.target.getBoundingClientRect(); const h = (0 < rect.top && rect.top < clientHeight) // 対象の上端は表示領域に入っている || (0 < rect.bottom && rect.bottom < clientHeight) // 対象の下端は表示領域に入っている || (0 > rect.top && rect.bottom > clientHeight); // 間が表示されている if(h) { // 対象が表示されていないとき header.classList.remove('scrolled'); // scorlledクラスを削除 } else { // 対象が表示されているとき header.classList.add('scrolled'); // scorlledクラスを付与 } } }); observer.observe(target); // 監視開始 })();