Home > Developer > Web Develop
This is the work encountered ScrollTop () method. To strengthen yourself, record it in the blog park.
Here's how to start scrolltop usage:
scrolltop () Definition and usageThe ScrollTop () method sets or returns the vertical scroll bar position of the selected element.
Note:
When the scroll bar position is at the top, the position is 0;
When used to return a position :
The method returns the vertical position of the scrollbar for the first matching element .
When used to set the location :
This method sets the vertical position of all the matching elements of the scrollbar.
return scroll bar position
$ (selector). ScrollTop ()
Set scroll bar position
$ (selector). scrolltop (position)
Parameter position: Specifies the position of the vertical scroll bar in pixels.
scrolltop () instance<! DOCTYPE html>
<script src= "Http://libs.baidu.com/jquery/1.10.2/jquery.min.js" >
</script>
<script>
$ (document). Ready (function () {
$ ("button"). Click (function () {
Alert ($ ("div"). ScrollTop () + "px");
});
It is important to note that the values here cannot be quoted. Do not add px. You just need to give the numbers.
$ ("#btn"). Click (function () {
$ ("div"). ScrollTop (60));
});
});
</script>
<body>
<div style= "border:1px solid Black;width:100px;height:150px;overflow:auto" >
This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</div><br>
<button>return the vertical position of the scrollbar</button>
<button id= "BTN" >return the vertical position of the scrollbar</button>
<p>move the scrollbar down and click the button again.</p>
</body>
Deep understanding of the ScrollTop () method in jquery
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
