jqueryのソースコードをJavaScriptで書く場合の方法を教えてください

首記の件、下記ソースコードを
JavaScriptで書く場合、どのように記述するのか教えて頂きたくお願い致します。

Jqueryソースコード：
$(function(){
$(window).scroll(function (){
$('.fadein_left, .fadein_right').each(function(){
var elemPos = $(this).offset().top;
var scroll = $(window).scrollTop();
var windowHeight = $(window).height();
if (scroll > elemPos - windowHeight + 150){
$(this).addClass('scrollin');
}
});
});
});

No.1 ベストアンサー 回答者： yambejp 回答日時： 2020/10/07 10:10

実際に動くサンプルが無いと挙動の確認ができないので微妙ですが

ざっくりこんなかんじ

window.addEventListener('DOMContentLoaded', ()=>{
window.addEventListener('scroll',()=>{
document.querySelectorAll('.fadein_left, .fadein_right').forEach(x=>{
var scroll = window.pageYOffset;
var elemPos = x.getBoundingClientRect().top+scroll;
var windowHeight = document.documentElement.offsetHeight;
if (scroll > elemPos - windowHeight + 150){
x.classList.add('scrollin');
}
});
});
});

この回答へのお礼

回答ありがとうございます。

張り付けただけで何の問題もなく出来ました。
あとは、これが理解できるように頑張ります。

また、何かありましたら何卒お願い致します。
ありがとうございました。

お礼日時：2020/10/08 17:25