'스크롤 이동시키기' 태그의 글 목록

스크롤 이동시키기

클릭시 특정 태그 위치로 스크롤을 이동시키기 2017.06.11 1

클릭시 특정 태그 위치로 스크롤을 이동시키기

2017. 6. 11. 21:34

[ 클릭시 특정 태그 위치로 스크롤을 이동시키기 ]

<!DOCTYPE html>

<head>
 <meta charset="utf-8">
 <title></title>
 <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
 <style media="screen">
 /*
 버튼은 화면 스크롤이 아무리 내려가도 절대위치로 항상 같은 위치에 있도록 하기 위해
 스타일을 지정해 준다.
 */
 #moveBtn{
 position: fixed;
 left: 10px;
 top:10px;
 }
 </style>
 </head>

// 1. pre태그의 위치를 가지고 있는 객체를 얻어온다. => offset 객체
          var offset = $("#preId").offset();

// offset은 절대 위치를 가져온다. offset.top을 통해 상단의 좌표를 가져온다.
          // position은 부모를 기준으로한 상대위치를 가져온다.
          $("html body").animate({scrollTop:offset.top},2000);

});
 }); // end of ready()
 </script>

저작자표시

'개발 > Javascript' 카테고리의 다른 글

무한스크롤 구현 (스크롤 마지막을 인식하는 이벤트 처리) (8)	2017.06.11
동적으로 생성된 태그에 이벤트를 걸려면 어떻게 해야할까?? (1)	2017.06.11
이벤트 발생시 a 태그의 이동기능을 동작하지 않게하고 처리하기 (0)	2017.06.11
JQuery 애니메이션 관련 정리(fadeIn,fadeOut,hide,show,animate,stop) (0)	2017.06.11
4. script 선언의 위치?!! (0)	2017.06.11

PREV 1 NEXT

악덕고용주의 개발 일기