Creating 3D Leaflets - Interactive Web Project
Interactive Web Projects is a series of creative interactive examples created using CSS and JavaScript.
756 learners
Level Intermediate
Course period Unlimited

- Unresolved
transform-style: preserve-3d; 를 추가하면
.page:nth-child(2) 에 .back-btn 버튼이 눌리지 않아, 원본 코드를 보니 .page-face 에 transform-style: preserve-3d; 가 추가 되어 있어서 적용했습니다. 그런데,
HTML/CSSjavascript인터랙티브-웹goldenparachute3422
・
4 months ago
0
38
1
- Unresolved
Babel의 사용법 아래 링크의 영상이 비공개 동영상이라고 뜹니다.
비공개 영상인데, 어떻게 영상을 볼 수 있나요?
HTML/CSSjavascript인터랙티브-웹14212424
・
0
96
1
- Unresolved
페이지 클래스리스트 제거 해줬을때
(() => { const leaflet = document.querySelector('.leaflet'); const pagesElem = document.querySelector('.pa
HTML/CSSjavascript인터랙티브-웹samkookji120994
・
0
81
0
- Unresolved
페이지를 클릭할 때 Uncaught TypeError: Cannot read properties of undefined (reading 'contains') 에러가 뜹니다.
<img src="https://cdn.inflearn.com/public/fil
HTML/CSSjavascript인터랙티브-웹jayscodinggarden
・
0
1,011
1
- Unresolved
질문 있습니다ㅠ.ㅠ..
지금 1, 3번은 back-btn이 제대로 포커스가 되는데 2번만 계속 page-face가 잡혀요..어떤 이유 때문일까요8ㅅ8
HTML/CSSjavascript인터랙티브-웹hong00412
・
0
401
1
- Unresolved
클릭 시 자꾸 page element만 인식됩니다.
위 화면에서 BackBtn이 인식이 되지 않고 Page el
HTML/CSS인터랙티브-웹javascriptmax4761max1733
・
0
225
1
- Unresolved
가운데 페이지만 줌인이 됩니다
양 옆 페이지의 요소들을 클릭해도 줌인이 안되고, 가운데 페이지의 요소만 줌인이 됩니다. 왜 그런지 모르겠어요... 올려주신 소스코드에서 그대로 해도 양 옆은 줌인이 되지 않습니다. 파이어폭스에서는 작동하는데 이미지가 표시되지 않습니다 <pre class=
질문javascriptHTML/CSS인터랙티브-웹haejin
・
0
253
1
- Unresolved
body에 perspective를 주면 갑자기 html과 body 높이가 0이 됩니다
body에 perspective를 주면 html, body가 높이가 0이 되어서 일단 body에 100vh 주긴 했는데.. 왜 강의와는 다르게 적용되는 걸까요?
javascript인터랙티브-웹HTML/CSSdotdot
・
0
393
1
- Unresolved
줌인 상태일 때
줌인 상태일 때, current-menu 클래스가 추가된 menu-item 외에 다른 menu-item을 누르면 leaflet 의 위치가 바뀌면서 틀이 틀어지는 이슈가 생겼습니다. current-menu 클래스가 메뉴 중 1개라도 추가가
javascriptHTML/CSS인터랙티브-웹leh87671680
・
0
258
1
- Unresolved
이벤트 위임 방식 질문
이벤트 위임 방식으로 하게되면 현재 2F를 감싸는 page 에도 page-flipped 클래스가 추가가 됩니다. 2F를 감싸는 page 에는 page-flipped 클래스가 추가가 되지 않게 하려면 data- 속성을 이용해 적용
HTML/CSSjavascript인터랙티브-웹leh87671680
・
0
219
1
- Unresolved
이사람 누군지 아세요..?
누구지.... 왜 물어 보지.... :0 몰라서 구글링 해 보았어요. <img src="https://cdn.inflearn.com/public/files/posts/3598ce1d-8207-405d-bc6a-db3e73cd09e0/who
인터랙티브-웹javascriptHTML/CSScookatrice
・
3
409
1
- Unresolved
선생님 질문있습니다 이 강의를 리액트환경에서 적용하고싶은데요,
그럴경우 useEffect 안에서 함수 처리를 해줘야할까요? 예를들어 이런식으로? <div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier Ne
HTML/CSSjavascript인터랙티브-웹wndtlr10248980
・
0
276
1
- Unresolved
질문있습니다.
forwards 를 작성안해줘도 애니메이션이 제대로 동작하는데요. 어떤 현상 때문에 적용을 하신것인지 궁금합니다! 그리고 menu-item을 클릭하혀 줌인이 되었을때 다른곳을 클릭하면 레이아웃(?)이 다른데로 이동되는현상이있는데요 이런경우
인터랙티브-웹javascriptHTML/CSSwndtlr10248980
・
0
199
1
- Unresolved
선생님 질문잇습니다. ㅠ
백페이스 히든 줘도 각도를 돌리면 그 뒷면이보이는건가요? 백페이스 자체가 뒷면만 안보이게 하는속성인가요 ㅠ? 백페이스를 안주고 preserve-3d만 주어도 눈에 보이기에는 똑같아 보이는데 따로 꼭줘야 되는 속성인가요 ㅠ?
HTML/CSS인터랙티브-웹javascriptdbstjdgy61339
・
0
262
1
- Unresolved
줌인이 왜 안되는지를 모르겠어요..
(() => { const leaflet = document.querySelector(".leaflet"); const pageElems = document.querySelecto
HTML/CSSjavascript인터랙티브-웹kha28581520
・
1
260
1
- Unresolved
질문이 있어요
각 페이지마다 transform-style: preserve-3d로 설정해주면 .page-face의 backface-visibility : hidden이 없어도 앞, 뒷면 확인이 잘 되니까 backface-visibility : hidde
HTML/CSS인터랙티브-웹javascriptgcy
・
1
240
1
- Unresolved
질문 있습니다.
body에 perspective를 주었고 leaflet에 preserve-3d를 아직 해주지 않았는데 어떻게 page는 rotateY의 3d 효과가 적용된건가요?? body의 perspective효과가 html태그 단계를 거치면 적용이 안된다고 하셨는
javascript인터랙티브-웹HTML/CSSxf6a4or71284
・
0
362
2
- Unresolved
선생님 질문 있습니다!
안녕하세요 궁금한점이 있어서 질문 드립니다 ㅠ.. 제가 지금까지 선생님 강의를 봐왔을시에는, 항상 부모 태그에 position: relative 를 적용 해 주신다음, 자식 태그에 position:absolute를 써주신 걸로 알고 있습니다.
인터랙티브-웹javascriptHTML/CSSrlfalstlr061198
・
1
254
2
- Unresolved
쌤 화면 크기 줄엿을때 글자들 삐져나오는거는 어떻게 해결하죠?
<img src="https://cdn.inflearn.com/public/files/posts/94a31273-9563-4e88-9dd7-32b97cd3b3ca/주석 2020-05-27 161619.png" title="주석 2020-05-27 161619.pn
javascriptHTML/CSS인터랙티브-웹thdwlgnsl1225
・
0
381
2
- Unresolved
소스코드 압축이 풀리지 않습니다.
반디집으로 풀었는데 파일 압축이 풀리지 않아 소스코드를 볼수가 없습니다. 혹시 파일을 메일로 받을수 있는지 여쭤봅니다. damanegi1979@naver.com 입니다. 수고하세요~
javascriptHTML/CSS인터랙티브-웹damanegi19792756
・
0
320
4

