<div class="codetitle"> <span><a style="CURSOR: pointer" data="89425" class="copybut" id="copybut89425" onclick="doCopy('code89425')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code89425"> <br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br><html xmlns="http://www.w3.org/ 1999/xhtml" > <br><head> <br><title>Untitled Page</title> <br><script type="text/javascript" src=jquery-1.8.0.js>< ;/script> <br><script> <br>$(document).ready(function () { <br>//When the top button is clicked, the method is executed, and the scrollTop attribute obtains the distance between the selected label and the scroll bar . <br>$('#top').click(function () { <br>$('html').animate( <br>{ scrollTop: '0px' }, 1000 <br>); <br> }); <br>//When the bottom label is clicked, the method is executed, in which offset() obtains the relative offset of the matching element in the current viewport, and returns an object with two attributes top, left <br>/ Of course, we can also set the second attribute of /animate, 'slow', 'normal' or 'fast' <br>$('#foot').click(function () { <br>$('html') .animate( <br>{scrollTop:$('span').offset().top},1000 <br>); <br>}); <br>}); <br></script> <br></head> <br><body> <br><br /> <br /> <br /> <br /> <br /> <br> <a href="#" id="foot">Bottom</a> <br><br /> <br /> <br /> <br /> < br /> <br><br /> <br /> <br /> <br /> <br /> <br><br><a href="# " id="top">TOP</a> <br><br /> <br /> <br /> <br /> <br /> <br> <span></span> <br></body> <br></html> <br> </div>
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
