반응형
jquery 스크롤 자동 이동 (바로)
$(document).ready(function(){
const offset = $("#target").offset();
$('html, body').animate({scrollTop: offset.top}, 0);
});
- 이동하고 싶은 엘리먼트에 id 선언,
- 위 처럼 id='target'으로 설정 또는 #target 정보에 선언된 ID로 변경,
- class, element name 상관 없음.
jquery 스크롤 자동 이동 (부드럽게)
$(document).ready(function(){
const offset = $("#target").offset();
$('html, body').animate({scrollTop: offset.top}, 500);
});
- animate 뒤의 인자에 숫자를 입력하면 숫자가 클 수록 천천히 이동.
offset() 살펴보기
$('#target').offset()
{top: 366.5, left: 0}
- offset() 에는 top, left가 있다.
반응형
'skill > HTML.Javscript.CSS' 카테고리의 다른 글
[javascript] form data -> json 변경 및 list(배열) 타입 (0) | 2021.05.12 |
---|---|
[javascript/css] 출력(print) 및 다음장 넘기기 (0) | 2021.05.12 |
vue.js 기본 (0) | 2019.02.08 |
위 화면 고정, 컨텐츠 화면 스크롤 시키기_javascript, css, html (0) | 2017.01.17 |
자동 색 변경_javascript, jquery (0) | 2017.01.17 |