How to use scroll bar to listen for events in jquery

coldplay.xixi
Release: 2023-01-04 09:37:05
Original
8570 people have browsed it

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.

How to use scroll bar to listen for events in jquery

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"); } }) })
Copy after login

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!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!