「jQuery」scrollTop()で要素のスクロール上の位置を取得するサンプル

2021年3月15日

書式
$(this).scrollTop()
使用例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 <script>
  $(document).ready(function(){
    $('.info').scroll(function(){
      $('#deta').text('スクロール上の上位置: '+$(this).scrollTop()+' px');
    });
  });
  </script>
  <style>
div {
    height: 100px;
    overflow: auto;
    border: 1px solid black;
  }
  </style>
</head>
<body>
<p id="deta">スクロール上の上位置: </p>
<div class="info">
aaa<br/>bb<br/>cc<br/>dd<br/>ee<br/>ff<br/>
</div><br>

</body>
</html>

jQuery

Posted by arkgame