jQuery/jQuery 스크롤 애니메이션

TOP 버튼 제이쿼리 scrolltop 정리

hyojinny 2022. 12. 15. 13:02

탑버튼을 누르면 페이지 상단이동 

 

 

 

$() 란? 제이쿼리 선택자 함수이다.

 

제이쿼리객체가 리턴이 된다 {객체}

 

 

  $('#footer .top_wrap .btn_top').on('click', function (e) {
    e.preventDefault();
    $('html, body').animate({ scrollTop: 0 }, 500);
  });

 

객체표현법 {} 는 객체이다. 

 

.animate 의 객체안에 {
속성:값
객체안에 객체
배열안에 배열 다 가능 
}
 
    $('html, body').animate({
      scrollTop: 0,
      border: '2px solid red',
      width: 1000,
    });
 
{} 객체 표현법으로 
추가 css 속성값들을 적을 수 있다. 
 
 
 
 
 
    $('html, body').animate(
      {
        scrollTop: 0,
      },
      600,
      ' easeOutExpo',
      function () {}
    );
 
추가로 ease 값솨 콜백함수도 적용가능 
 
 
 
 
 
 

$()

제이쿼리 선택자 함수 

 

제이쿼리객체가 리턴이 됨 

{객체}