inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

3D리플릿 만들기 - 인터랙티브 웹 프로젝트

3D 리플릿 만들기 #10

질문있습니다.

210

반가우면반갑다고해

작성한 질문수 142

0

forwards 를 작성안해줘도 애니메이션이 제대로 동작하는데요.

어떤 현상 때문에 적용을 하신것인지 궁금합니다!

그리고 menu-item을 클릭하혀 줌인이 되었을때 다른곳을 클릭하면 레이아웃(?)이 다른데로 이동되는현상이있는데요 이런경우 어떤식으로 접근해줘야 이같은 현상을 방지 할 수 있을까요?

인터랙티브-웹 javascript HTML/CSS

답변 1

1

1분코딩

스크립트로 처리하기 전, 마지막 상태를 유지하기 위해 넣어주었었습니다.
완성된 코드에서는 나중에 스크립트에서 인라인 CSS가 덮어쓰기 때문에 말씀대로 필요는 없어지겠네요^^

줌인 된 상태에서 다른 곳을 클릭했을 때 이상한 위치로 이동하는 것은 미처 발견하지 못했던 버그네요!
고쳐서 다시 소스코드를 업데이트 해두었으니, 다시 다운로드 받아보세요~
수정한 부분은 main.js의 99라인 ~ 102라인입니다. // 추가 코드라고 주석을 달아두었습니다.
클릭했을 때, body에 zoom-in 클래스가 없는 경우에만 동작하도록 수정했습니다.

if (!document.body.classList.contains('zoom-in')) {
zoomIn(menuItemElem);
}

프론트엔드 학습 수준 문의

0

8

1

선생님 각 강좌마다 예시로 보여주시는 웹페이지들은 어디서

0

9

1

퍼플렉시티 최소 결제단위 50달러로 바뀐 것 같습니다.

0

29

2

리액트 챕터별 코드에서 eslint 설정파일이 없어요

0

34

2

claude plugin 방법 자세히 부탁드려요

0

33

2

transform-style: preserve-3d; 를 추가하면

0

47

1

Babel의 사용법 아래 링크의 영상이 비공개 동영상이라고 뜹니다.

0

115

1

페이지 클래스리스트 제거 해줬을때

0

91

0

페이지를 클릭할 때 Uncaught TypeError: Cannot read properties of undefined (reading 'contains') 에러가 뜹니다.

0

1044

1

질문 있습니다ㅠ.ㅠ..

0

409

1

클릭 시 자꾸 page element만 인식됩니다.

0

239

1

가운데 페이지만 줌인이 됩니다

0

267

1

body에 perspective를 주면 갑자기 html과 body 높이가 0이 됩니다

0

401

1

줌인 상태일 때

0

265

1

이벤트 위임 방식 질문

0

228

1

이사람 누군지 아세요..?

3

420

1

선생님 질문있습니다 이 강의를 리액트환경에서 적용하고싶은데요,

0

288

1

선생님 질문잇습니다. ㅠ

0

270

1

줌인이 왜 안되는지를 모르겠어요..

1

274

1

질문이 있어요

1

248

1

질문 있습니다.

0

374

2

선생님 질문 있습니다!

1

268

2

쌤 화면 크기 줄엿을때 글자들 삐져나오는거는 어떻게 해결하죠?

0

395

2

소스코드 압축이 풀리지 않습니다.

0

340

4