[KDT]FCFE - 3주5일 slider 만들기

Keunyeong Lee·2021년 12월 10일
0
post-thumbnail

slider 무한루프 만들기

방식

A -> B -> C -> A -> B -> C -> A -> B -> C 로 만들기 위해

C'-> A -> B -> C -> A' 로 양끝에 클론을 만들어 놓고

양끝에 C' 혹은 A' 에 도착하면 에니매이션을 잠깐 끄고 C 혹은 A 로 다시 옮긴다.

클론만들기

요소.cloneNode(true);

요소 삽입

요소 맨 뒤에 넣기

부모요소.append(제일 뒤에 넣을 요소)

요소 맨 앞에 넣기

부모요소.insertBefore(넣을 요소, 기준점)

insertBefore는 기준점보다 앞에 넣어준다.

기준점을 맨앞 요소로 잡으면 맨앞에 추가 된다.

쓰로틀링과 디바운싱

Throttling&Debouncing

함수 실행 context

const a = 10;
foo(a);
function foo(b) {
    let c = 20;
    console.log(a + b + c);
}

실행순서 보기

profile
🏃🏽 동적인 개발자

0개의 댓글