📜  如何使用 JavaScript 获取滚动条的位置?

📅  最后修改于: 2022-05-13 01:56:51.840000             🧑  作者: Mango

如何使用 JavaScript 获取滚动条的位置?

JavaScript 是一种了不起的语言,并且有许多可用的功能,我们可以通过这些功能通过 javascript 访问 HTML 页面的任何元素。有一些简单的技术可以获取下面讨论的滚动条位置:

方法一:每当遇到函数getScroll()时,它将滚动条的当前值设置为idposition的 span 元素。沿水平和垂直轴的滚动条位置用整数表示。 pageXOffset 属性返回沿水平轴(即左右)滚动的像素数,pageYOffset 属性返回沿垂直轴(即顶部和底部)滚动的像素数。 pageXOffset 和 pageYOffset 属性等于 scrollX 和 scrollY 属性并且是只读属性。

  • 程序:
    
    
      
    
        
            Scrollbar position using JavaScript/jQuery?
        
        
    
      
    
        

             GeeksforGeeks      

        
            

    Current position is:                    

        
        

          Click on the buttons below to get the current       position of the scrollbar.     

           

          GeeksforGeeks is a computer science portal.        This is a large scrollable area.                                   

                
  • 输出:

方法2:使用事件监听器滚动条位置。 Window 接口表示一个包含 DOM 文档的窗口,我们可以通过在其上添加事件侦听器来获取滚动条的位置。每当滚动事件触发时,此函数将自动触发。 scrollX 和 scrollY 返回浮动值。每当滚动事件发生时,事件侦听器将自动触发并更新 id 为位置的元素中滚动条位置的值。

  • 程序:
    
    
      
    
        
            Scrollbar position using JavaScript/jQuery?
        
        
    
      
    
        

          GeeksforGeeks      

           
            

    Current position is:                    

        
        

          Click on the buttons below to get the        current position of the scrollbar.     

           

          GeeksforGeeks is a computer science portal.       This is a large scrollable area.     

           
  • 输出: