ASP.NET jQuery Example 9 Using the control hyperlink to achieve the return to top effect_jquery

To achieve this effect, you must first understand the following basic knowledge:
Form scroll event: $(window).scroll(function(){...});
Get the form scroll distance: $ (window).scrollTop();
Get the height of the form: $(window).height();
Understanding the above content, you can achieve the effect of returning to the top through the hyperlink control.
1. Prepare the interface structure code:

Copy the code The code is as follows:

< form id="form1" runat="server">

Use jQuery to achieve the return to top effect

. . . . . . (A lot of content, you can scroll)

Back to top

2. Add styles to the top control:

Copy code The code is as follows:

3. Add the script code to achieve the top effect:

Copy code code As follows:

Note that this code is only to demonstrate the hyperlink control to achieve the effect of returning to the top. You can also use jQuery animation effects to achieve smooth top positioning.
The code for smooth transition back to the top is as follows:
$('#backToTopLink').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);} ); // Replace $("#backToTopLink").attr("href", "#Top");