Javascript 为什么scrollTop有一个小数部分？

当我在视频上按play时，试图向下滚动包含大量数据的div

我的scrollTop是

211.25

，但我的

scrollHeight是
711
，clientHeight是
500px

我必须在scrollTop上放置一个
Math.floor
，使其成为偶数

这个
.25px
从哪里来

HTML:

<video id="v0" tabindex="0" autobuffer="autobuffer" preload="preload" controls>
  <source src="http://res.cloudinary.com/david-wash-blog/video/upload/sample-video.mp4" type="video/mp4"></source>
  <p>Sorry, your browser does not support the &lt;video&gt; element.</p>
</video> 
<div id="data-scroll">
   SOME DATA
   SOME DATA
   SOME DATA
   SOME DATA
   SOME DATA
   SOME DATA

</div> 

JAVASCRIPT:

(function(){
  var vid = document.getElementById('v0'); 
  var dataScroll = document.getElementById('data-scroll');
  var controls = document.getElementById('controls');


  function playScroll(){
      console.log(`clientHeight:${dataScroll.clientHeight}`);
      console.log(`scrollHeight: ${dataScroll.scrollHeight}`);
      console.log(`scrolling dataScroll @ ${dataScroll.scrollTop}`);
      script.scrollTop += 100;
      if(dataScroll.scrollHeight - Math.floor(dataScroll.scrollTop) === script.clientHeight){
        console.log(`stop scrolling dataScroll @ ${dataScroll.scrollTop}`);
        window.cancelAnimationFrame(playScroll);
      }
      window.requestAnimationFrame(playScroll);
    }

  vid.addEventListener('play', function(){
    window.requestAnimationFrame(playScroll);
  });
}());

我认为这就是浏览器认为滚动顶部的位置。部分像素值是很正常的。我没有填充或任何东西。我不知道它从哪里得到
.25px
。我不知道浏览器是如何假设它是一个.25px的好吧，我们无法判断在您的具体情况下发生了什么，因为代码不完整，但假设您有一个400 px宽300 px高的图像，但它显示的宽度为525.0像素，那么高度将变为393.75像素。这将影响它下面的所有内容块。检查页面，您可能会发现类似的内容。啊，好的，这是有意义的，我将使用wed dev工具进行检查，以获得内部元素的精确高度，我之前尝试过，但是在数据本身而不是父对象上。根据规范，“在使用显示缩放的系统上，scrollTop可能会给您一个十进制值。”我认为这就是浏览器认为滚动顶部的位置。部分像素值是很正常的。我没有填充或任何东西。我不知道它从哪里得到
.25px
。我不知道浏览器是如何假设它是一个.25px的好吧，我们无法判断在您的具体情况下发生了什么，因为代码不完整，但假设您有一个400 px宽300 px高的图像，但它显示的宽度为525.0像素，那么高度将变为393.75像素。这将影响它下面的所有内容块。检查页面，您可能会发现类似的内容。啊，好的，这是有意义的，我将使用wed dev工具进行检查，以获得内部元素的精确高度，我之前尝试过，但是在数据本身而不是父对象上。根据规范，“在使用显示缩放的系统上，scrollTop可能会给您一个十进制值。”
(function(){
  var vid = document.getElementById('v0'); 
  var dataScroll = document.getElementById('data-scroll');
  var controls = document.getElementById('controls');


  function playScroll(){
      console.log(`clientHeight:${dataScroll.clientHeight}`);
      console.log(`scrollHeight: ${dataScroll.scrollHeight}`);
      console.log(`scrolling dataScroll @ ${dataScroll.scrollTop}`);
      script.scrollTop += 100;
      if(dataScroll.scrollHeight - Math.floor(dataScroll.scrollTop) === script.clientHeight){
        console.log(`stop scrolling dataScroll @ ${dataScroll.scrollTop}`);
        window.cancelAnimationFrame(playScroll);
      }
      window.requestAnimationFrame(playScroll);
    }

  vid.addEventListener('play', function(){
    window.requestAnimationFrame(playScroll);
  });
}());