inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

인터랙티브 웹 개발 제대로 시작하기

전진! 3D 스크롤 5

rotate() 사용시 좌표 방향 기준

491

znffjdznffjd

작성한 질문수 5

0

강사님 영상 재밌게 보고있습니다.

영상 07:10초쯤에서 오른쪽 측면용 벽 너비를 1000vw로 설정하고 z축으로 이동시켜주신다 하셨는데요.

저는 당연히 x축으로 이동시켜야 된다고 생각했는데, 이게 원리가 3d공간에서 rotate()시 요소의 좌표기준방향도 같이 회전되서 바뀌는 원리인가요??

API관련해서 mdn찾아봐도 관련내용은 쉽게 찾을수가없네용.. 혹시 3d관련해서 참고할 리소스 추천해주실 수 있으신가요?

감사합니당:)

HTML/CSS javascript 인터랙티브-웹

답변 2

1

1분코딩

아이고, 답변이 늦었습니다.
이해하신게 맞습니다.
나 자신이 제자리 회전을 한다고 가정하면,
내가 어떤 방향으로 회전을 하든 내 앞뒤 방향이 Z축이잖아요? 그렇게 생각하시면 됩니다.

CSS 3D는 아래 링크에도 잘 정리가 되어있습니다.
한국어 자료는 찾기가 쉽지 않네요^^;
공부 화이팅입니다!
https://3dtransforms.desandro.com/

0

최문경

강의를 들으면서 문득 든 생각인데요~ 1분코딩님은  인터랙티브 웹에 대해서 어떻게 공부하셨는지 궁금합니다! 1분코딩님도 강의를 보면서 하셨는지 아니면 문서를 보면서 혼자 공부하셨는지요~

왼쪽/오른쪽 동작시 딜레이 문제

0

93

1

변수 범위 관련 질문

0

106

1

perspective 문의

0

102

1

생성자 함수를 클래스 함수로 변경 하고 this 오류 관련

0

150

1

스크롤이 중간 위치에 있을 때 창의 크기를 변환하면 생기는 문제

0

127

1

animation이벤트 질문이요!

0

72

1

resize handler에서 질문이 있습니다.

0

111

1

카드 뒤집힐 때 F가 보인 이유

0

149

1

3d 뒤집기 추가효과

0

218

1

전진! 3D 스크롤 21 강의 질문

1

171

1

eventlistener 질문

0

149

1

zMove 를 1000으로 설정하는 이유에 대하여.

0

168

1

[정보-23강] ES6 class 문법으로 공부하시는 분들!! 화살표 함수로도 시도해보셔요!

1

191

1

동적으로 html 생성 후 이벤트 위임 질문 있습니다.

0

266

1

rotateY()에서 deg에 따른 차이

0

197

1

코드 작성 순서

0

276

1

이미지가 없는데 첨부파일을 다운 받는 방법이 있나요??

1

394

1

'이벤트 위임 보강 영상'에 있는 예제 html이 안 보입니다

0

265

2

섹션5 자바스크립트 이벤트 다루기 질문

1

243

1

[#전진! 3D 스크롤 11] mousePos 공식 질문 있습니다!

0

423

2

css 는 직접 작성을 해야하는걸까용?

0

326

1

translateZ 에 px 이 아닌 vw 로 값을 주신 이유가 있을가요?

0

361

2

house 부분에도 width , height 부분을 꽉 차게 주신 부분이 제가 이해한게 맞는지 궁금합니다.

0

305

2

left:-400vw 가 아닌 translateZ(100vw); 을 입력하신 이유가 궁금합니다.

0

306

2