2014-10-19 6 views
0

내 블로그에 링크를 만들어 링크를 클릭하면 링크가 웹 페이지를 페이지 상단으로 스크롤합니다. 온라인 튜토리얼 (예 : http://www.webtipblog.com/adding-scroll-top-button-website/)을 읽었습니다.이 튜토리얼의 대부분은 이미지를 맨 위에 스크롤하는 방법을 보여줍니다.애니메이션 상단 링크로 스크롤

내 블로그로 스크롤하면 http://goneintranslation.blogpost.ca "home"이라는 링크가 있습니다.이 링크를 클릭하면 사용자가 클릭하면 상단으로 스크롤됩니다. 누구든지 어떤 기사를 아는가? 아니면 어떻게 코드화 할 것인가?

감사합니다.

편집; 나는이 웹 사이트 (http://thechrisellefactor.com/)와 같은 것을하고 싶다. 맨 아래로 스크롤하면 "페이지 상단으로 돌아 가기"라는 링크가있다.

답변

1
$('.scroll-top-wrapper').on('click', scrollToTop); 

여기가 마술이 일어나는 곳입니다. "scroll-top-wrapper"라는 클래스가있는 요소를 클릭하면 scrollToTop 함수가 실행됩니다.

이 클래스 내의 요소가 이미지 또는 일반 링크인지 여부는 중요하지 않습니다. 당신의 class 또는 id

0

JS Fiddle

$(window).scroll(function() { 
    if ($(window).scrollTop() > 250) { 
     $('.top').addClass('show'); 
    } else { 
     $('.top').removeClass('show'); 
    } 
}) 

대체 .top있는이 ...

$(".top").click(function (event) { 
    event.preventDefault(); 
    $('html,body').animate({ 
     scrollTop: 0 
    }, 1000); 
}) 
0
우리는이 문제를 해결하기 위해 JQuery와 애니메이션의 방법을 사용할 필요가

맨 위로 스크롤해야

jQuery 코드

$("#scrollT").click(function(e){ 
    e.preventDefault(); 
    $("html, body").animate({ scrollTop: "0px" }); 
}); 

http://jsfiddle.net/6g4af5b5/