어떻게이 작업을 수행 할 수 있습니까? Doodle team page

Question

JS의 모든 것들에 대해 꽤 새로운데, 어떻게하면 낙서 팀 페이지와 같은 팀 페이지를 만들 수 있는지 궁금합니다.

마우스 커서를 움직여 위치를 기준으로 이미지를 변경하는 것은 상당히 어려워 보입니다.

http://doodle.com/de/ueber-doodle/team

사람은 심지어 같은 빌드를 시작하는 방법에 대한 어떤 생각을 가지고 있습니까?

여기에 의견을 보내 주시면 감사하겠습니다.

고맙습니다.

Answer 1

매우 광범위한 질문이기 때문에 누구도이 질문에 대한 확실한 대답을하지는 않을 것입니다.

매우의 기본 방법을 보여주는 피들입니다. 왼쪽 및 오른쪽 마주 보는 이미지 만 사용하십시오. 당신은 그들이 가지고있는 것을 성취하기 위해 이것을 훨씬 더 큰 스케일로 추상화 할 수 있습니다.

http://jsfiddle.net/xwdeo6u3/

는 기본적으로 사용자의 마우스가 어디 있는지 추적하고, 요소의 background-position 따라 조정.

The actual image used is this.

Here의 사이트에서 소스 코드의 일부를.