스마트웹앱콘텐츠전문가/자바스크립트
절대 좌표 확인 + 이동함수
9D4U
2019. 5. 20. 15:49
728x90
반응형
1. offset() - 절대좌표 확인 및 이동함수 -> cf)상대좌표 position()
- 절대 좌표 확인 :
예시) var a = $('.apoint'); //선택자
a.offset().top; //상단을 기준으로 해당 선택자 요소가 위치한 거리를 절대좌표로 나타냄
a.offset().left; //좌측을 기준으로 해당 선택자 요소가 위치한 거리를 절대좌표로 나타냄
- 해당 요소 이동 :
예시) var a = $('.apoint'); //선택자
a.offset({top: 100, left: 200}); //절대좌표를 기준으로 상단에서 100px, 좌측에서 200px에 해당하는 좌표로 이동.
cf)offset() vs animate()
- offset은 순간적으로 이동시킬 수 있는 반면, animate는 동작시간을 지정하여 이동할수 있음.
※ 원하는 위치로 이동시키기(절대 좌표 즉, offset 사용)
예시) var atop = $('.apoint).offset().top;
$('html, body').animate({scrollTop : atop}, 300);
728x90