JSFiddle - React, Tailwind, and code Playground

by tea4two

HTML

<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<div class="box">かきくけこ</div>

JavaScript

$(window).on('scroll', function(event){

	console.log('スクロール！');
  console.log(event);
  
  // スクロール距離の求め方(あとでjQueryのメソッドで取得します)
  console.log(event.currentTarget.scrollY);
  

});

console.dir(  $('.box').offset()  );

console.dir(document.querySelector('.box'));