Rev. 2.73

CSS를 예술의 경지까지 끌어올린 Román Cortés씨는 순수 CSS만으로 3D 패럴랙스 효과를 만들어 내고 콜라 캔찌그러진 콜라 캔을 입체적으로 매핑한 경험이 있습니다. 그는 이제 조금더 실용적인 곳에 CSS 테크닉을 적용하기 시작했습니다. 위 예제 역시 약간의 HTML과 CSS만을 이용하여 작성된 것이며 마우스 행동에 따른 책장을 넘기는 효과가 적용되어 있습니다. 마치 플래시로 구현한 듯한 애니메이션을 보여주며, 그라디언트와 쉐도를 적절히 이용하여 사실적으로 표현했습니다. 웹킷 기반의 크롬과 사파리 브라우저에서만 작동하며 iOS나 맥OS 위의 사파리에서는 transition 속성이 하드웨어 가속을 지원하기 때문에 매우 부드러운 애니메이션을 경험할 수 있습니다. iOS에서는 약간 뒤틀리긴 하지만요.

아... 요것이랑 비슷한 것을 자바스크립트로 구현하던 짱박아둔 예제가 있었는데 완전히 새 됐군요.

Comments

Got something to add? You can just leave a comment.

Your Reaction Time!

captcha

avatar