Home / Questions / 129782
Accepted
PiledroMurcia
Asked: 2020-01-10 04:08:39 +0800 CST 2020-01-10 04:08:39 +0800 CST

如何使用 javascript 检测屏幕滚动的位置？[关闭]

  • 772

我的问题如下：我可以用javascript检测屏幕滚动的位置吗？

javascript

3 Answers

  1. 您可以使用：

    element.scrollTop // Vertical - Son los píxeles ocultos en la parte superior

element.scrollLeft // Horizontal - Son los píxeles ocultos en la parte izquierda

    要分别获得垂直和水平滚动，您已经滚动。

    澄清：

    elementdocument.body如果您需要了解整个页面，则可以。您可以将其与以下内容进行比较：

    element.offsetHeight // Son la cant de píxeles (a lo alto) que ves en el navegador.

element.offsetWidth // Son la cant de píxeles (a lo ancho) que ves en el navegador.

    如果你需要百分比。我的意思是，例如：滚动是垂直的 50%。

    • 4

  2. 是的，您可以使用window.scrollY和window.scrollX检查您的站立位置。

    • 4
  3. Best Answer

    我向您展示了一个使用Jquery的示例和另一个使用纯JavaScript的示例，它们可以满足您的需求：

    查询

    $(window).scroll(function(event) {
  var scrollLeft = $(window).scrollLeft();
  var scrollTop = $(window).scrollTop();
  console.log("Vertical "+scrollTop);
  console.log("Horizontal "+scrollLeft);
});
    .body{
width: 105%;
height: 700px;
background:#FFCC99;

}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="body">
</div>

    纯 JavaScript

    window.onscroll = function() {
  console.log("Vertical: " + window.scrollY);
  console.log("Horizontal: " + window.scrollX);

};
    .body {
  width: 105%;
  height: 700px;
  background: #FFCC99;
}
    <div id="body" class="body">
</div>

    • 4