js JQuery를 구현하는 방법 맨 위로 이동 function_jquery

많은 웹사이트에는 맨 위로 돌아가기 효과가 있습니다. 이 문서에서는 jquery를 사용하여 맨 위로 돌아가기 버튼을 구현하는 방법을 설명합니다.
먼저 다음 HTML 요소를 상단에 추가해야 합니다.

< /span> 상단 반환

a 태그는 앵커 포인트 상단을 가리킵니다. 이는 상단에 의 앵커 포인트를 방지할 수 있습니다. 브라우저가 js를 지원하지 않도록 최상위로 돌아가는 효과도 얻을 수 있습니다.
맨 위로 반환된 이미지를 오른쪽에 표시하려면 다음과 같은 CSS 스타일도 필요합니다.

예, HTML과 스타일, 페이지 스크롤 시 페이드 인 및 페이드 아웃되는 맨 위로 돌아가기 버튼을 제어하려면 js도 사용해야 합니다.
코드 복사 코드는 다음과 같습니다.

<script> <div class="codetitle">$(function(){ <span>//When 스크롤바 위치가 위에서 100픽셀 미만이면 점프링크가 나타나고, 그렇지 않으면 사라집니다. <a style="CURSOR: pointer" data="40558" class="copybut" id="copybut40558" onclick="doCopy('code40558')">$(function () { <u>$(window).scroll(function(){ </u>if ( $(window).scrollTop ()>100){ </a>$("#back-to-top").fadeIn(1500) </span>} </div>else <div class="codebody" id="code40558">{ <br>$( "#back-to-top").fadeOut(1500); <br>} <br>}) <br>//점프 링크를 클릭하면 페이지 상단으로 돌아갑니다<br>$("# 맨 위로") .click(function(){ <br>$('body,html').animate({scrollTop:0},1000); <br>return false; <br>}); <br>}) <br>}); <br></script>


다음 주소를 통해 실제 효과를 보실 수 있습니다:
http://outofmemory .cn/code- snippet/tagged/javascript
참고로 페이지를 로드한 후 스크롤 막대를 약간 아래로 드래그해야 맨 위로 돌아가는 효과를 확인할 수 있습니다.