How to use scroll bar to listen for events in jquery

How jquery uses scroll bars to listen to events: 1. Use [$(window).scrollTop():] to get the height of the vertical scroll bar from the head of the document; 2. Use [$(document).scrollLeft ()】Get the distance of the horizontal scroll bar.

The operating environment of this tutorial: windows7 system, jquery3.2.1 version, thinkpad t480 computer.

How jquery uses scroll bars to listen to events:

Let’s take an example first:

$(document).ready(function(){//在文档加载完毕后执行
    $(window).scroll(function(){//开始监听滚动条
        //获取当前滚动条高度
        var topp = $(document).scrollTop();
        //用于调试 弹出当前滚动条高度
        //alert(topp);
        //判断如果滚动条大于90则弹出 "ok"
        if(topp > 90){
        //alert("ok");
        }
    })
})

Syntax

• $(window).scrollTop();//Get the height of the vertical scroll bar from the head of the document

• $(document).scrollLeft () //Get the distance of the horizontal scroll bar

• $(document).height() //Get the height of the entire page

• $(window).height() //Get the current height, which is the height of the part of the page that your browser can see. This size will be displayed when you zoom in and out. The size of the browser window will change, which is different from the document

Related free learning recommendations: javascript (video)

The above is the detailed content of How to use scroll bar to listen for events in jquery. For more information, please follow other related articles on the PHP Chinese website!