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

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

(46개의 수강평)

708명의 수강생
김환석 프로필

이벤트 위임 보강 영상 파일 김환석 4일 전

안녕하세요! 강의 너무 잘 보고 있습니다!

다른게 아니고 이벤트 위임 보강 영상을 따라하면서 같이 하고 싶은데 파일이 있을까요?

이벤트 위임 파일 목록에는 보강 영상 파일이 없는거 같아서,, 혹시 제가 못찾은 거면 귀찮게 해드려서 죄송합니다..ㅜㅜ

2
정윤성 프로필

질문있습니다 ! 정윤성 9일 전

1.선생님의 예시에서는 class를 직접 삭제해주거나 제거해주는 방식으로 풀어나가셨는데 저는 직접 style코드를 주거나 뺏거나 하는 방식으로 풀어나갔거든요 혹시 이둘의 성능차이가 많이 클까요 ?

2.선생님의 해주신 방식으로하면 각 문을 광클할시 CSS가 삐죽거리면서 튀어나오는데 style을 직접 줬다 빼는 방식으로 할경우는 CSS가 삐죽 나오지않는데 혹시 어떤 차이점이 있는건지 알 수 있을까요 ?

1
조지헌 프로필

Character 조지헌 9일 전

캐릭터 생성자에서

run 함수에서도 사용하는 speed함수나 rafId같은 함수는 character 전역 변수로 선언하는게 이해가 되는데

lastScrollTop이나 scrollState같은 변수는 init 메서드 안에 있어도 될거 같은데  const self 외에 다른 변수들은 왜 선언하지 않고  character 전역변수로 선언하신건지 궁금합니다.

그리고 init 메서드 안에서 run메서드를 생성하고 이벤트 함수 안에서 requestAnimationFrame(run)을 하면

init 함수는 처음에 한 번만 사용하고 또 부르는건 init메서드 안의 run 함수니까 연산낭비가 없을거 같은데

run 함수를 따로 빼신 이유도 궁금합니다.

다른 분 질문에 답변 다신 걸 보니 이렇게 하면 초당 대략 60번씩 초기화가 되신다고 하신거 같아

이해가 잘 안됩니다 ㅠㅠ

init 메서드 안의 run 함수를 만들어 사용하면 init 메서드는 한 번만 실행되는게 아닌가요..?

2
조지헌 프로필

일분이 조지헌 14일 전

일분이 머리 몸통 팔 다리 png파일 받을수 있을까요?

캐릭터 따라 해보고 싶은데

포토샵을 쓸 줄 몰라서 캐릭터를 만들수가 없어요..

2
조지헌 프로필

이벤트 위임 조지헌 16일 전

body에 바로 이벤트 위임을 하면 전체 다 쓸 수 있는데 그렇게 안하는 이유가 궁금합니다.

.stage {

    width: 100vw;

    height: 100vh;

    background-color: #333;

}

이랑 

body {

    background-color: #333;

}

같아 보이는데

웹 화면 전체를 다 쓰더라도 body에 css를 적용하지 않고

div로 한 번 감싸고 쓰는게 규칙인가요??

너무 기초적인 질문 같아 죄송합니다..ㅠ

2
최광일 프로필

스크롤 한번에 120px 최광일 17일 전

스크롤 한번에 120px 정도 내려가는거 같은데요.

화면높이가 낮을때는 휠 횟수가 줄어드는데..

스크롤 한번에 휠내려가는 크기는 20px이나 50px이나 이런식으로 제가 원하는 크기만큼 바꿀수잇을까요?

3
조지헌 프로필

transform-style: preserve-3d 조지헌 18일 전

영상에서는 .world에 perspective를 설정하고

.card에 transform-style: preserve-3d를 설정하시면서

.world에 perspective설정하면 .card-side까지 안닿아서(?)

중간단계인 .card에 transform-style를 설정 해준다고 하셨는데

그럼 .card에 transform: perspective()로 설정해주면

fransform-style: preserve-3d 없이 되어야 한다고 생각했는데

해보니까 fransform-style: preserve-3d 없인 안되더라구요.

perspective는 원근감을 넣어주는 효과인데

fransform-style: preserve-3d의 정확한 역할은 뭔지 잘 모르겠습니다 ㅠ

그리고 .world에 perspective를 설정 하면 가운데를 기준으로 보는거니까

돌아가는 각도가 조금씩 달랐는데

원하는 각도대로 돌릴려면 .card에 각각 transform: perspective()를 해줘야 하는데

각각 다르게 돌아가는 .world에 perspective를 쓰는 경우는 어떤 경우가 있는지 궁금해요..

참고 사이트나 예시 같은거 알려주시면 감사하겠습니다!!

4
헙코딩신 프로필

그러면 e.currentTarget / This 헙코딩신 26일 전

그러면 e.currentTarget / This 의 차이는 무엇인가요?

같다고 보면 되는건가용??

1
토마토 프로필

선생님처럼 style 시트 부분 폰트를 변경하고 싶습니다. 토마토 28일 전

지금 다 회색으로 떠서 너무 가독성이 안 좋은데 

선생님처럼 바꾸는 방법을 알고 싶습니다.

3
이20170630 프로필

3D스크롤 23강의에서, run 메서드에 대해서 궁금합니다 이20170630 29일 전

3D스크롤예제  23강의에서,

requestAnimationFrame을 사용하기위해, 

init 메서드 형제 위치에 run 메서드를 추가해주셨는데요,

init: function () {

~~~

},

run: function () {

~~~

}

};

왜  init메서드안에 run메서드 내용을 포함 하지 않으신걸까용ㅠㅠ?

특별한 이유가 있는건지 궁금합니다!

(자바스크립트 할때에, 사람들이 대부분 쓰는 패턴이라서 인건지.. 아니면 단순히 리퀘~프레임을 쓰기위해, 복잡하지 않게 하려는 용도로 따로 빼신건지 궁금합니다ㅠㅠ 아니면... 자바스크립트 기초이론중에 기초로 알고있어야 했던 내용이였던건지...ㅠㅠㅠㅠㅠㅠ)

1
민수 프로필

완강하고 민수 1달 전

이해도 잘되고 강의가 재미있고 그래서 . 

CSS Flex와 Grid 제대로 익히기    SVG 마스터     인터랙티브 웹 프로젝트 #1 3D리플릿 만들기 

3개도 강의 완강 할려구하는데. 

어떤 것 부터 보는게 좋을까요.?

1
Rechel 프로필

Explorer에 관련하여 문의드립니다. Rechel 1달 전

안녕하세요. 영상과 결과물이 중간에 다르게 나와서 질문이 생겼습니다.

뒤집는 동작의 CSS 에서 backface-visibility:hidden을 주지 않아도 동작이 잘 되었습니다.

영상에서는 깜빡거리면서 요동을 쳤지만 전 잘 되길래 환경이 달라서 (영상은 mac의 Chrome)그런가보다 생각하다가 궁금해서 Explorer에서 동작을 실행시켜보았으나, backface를 주어도 적용되지 않아서요 : ) 혹 제가 무언가를 놓쳤을까요 ??

저의 환경은 

Windows 10
Explorer Version 11

입니다.  

1
토마토 프로필

head부분에 있는 내용들을 다 써야 하나요? 토마토 1달 전

emmet 깔아서 html치면

<head>

    <meta charset="utf-8">

    <title></title>

  </head>

이렇게만 자동 완성이 되는데 바꿀 수 있는 방법이 있을까요?

2
최광일 프로필

스크롤 타겟 최광일 1달 전

스크롤 타겟이 바디에 높이로 되어 있는데요

<div>   <- div 안에 높이로 

     <div>   <- 자식에 div를 컨트롤 할수잇는 방법도 잇을가요?

     </div>

</div>

2
최광일 프로필

width: 100vw; height: 100vh; 를하면 최광일 1달 전

width: 100vw; height: 100vh; 를하면 저는 스크롤 영역?만큼 좌우 상하에 스크롤리생기는데.. 다른방법으로 지워주셧나요?

1
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스