CSS3

썸네일이 예쁘게 나오는 이미지 슬라이드쇼

썸네일이 예쁘게 나오는 이미지 슬라이드쇼입니다. Elastic Image Slideshow with Thumbnail Preview [데모보기1] [데모보기2] »

동그란 엘리먼트에 hover, click 시 효과 주기

동그란 엘리먼트에 hover, click 시 효과를 줄 수 있는 demo 입니다. 이렇게 말씀으로 드리면 어떤 모양일지 상상이 잘 안가실 것 같은데 직접 보시면 좋을 것 같습니다. Hover and Click Trigger for Circular Elements with jQuery [데모보기] 동그란 엘리먼트는 CSS border-radius를 50%로 주면 만들 수 있습니다. 원래는 네모난 엘리먼트지만 border-radius로 인해 동그랗게 보이게 되는 것입니다. 여기에서 마우스 hover나 click시 문제가 생길 수 있습니다. 사용자에게 시각적으로는 동그랗게 보이게 만들어놨지만 실제로 엘리먼트는 네모낳게 생겼습니다. 따라서 사용자가 네모난 부분의 모서리쯤에 마우스를 hover하거나 click 했을 ... »

상하 좌우 슬라이드 이동이 가능한 CSS3 3D Slideshow

상하 좌우 슬라이드 이동이 가능한 CSS3 3D Slideshow 입니다. CSS3 3D Slideshow 좌우 화살표 키로 이동을 하다가 슬라이드에 상하 화살표 표시가 나오면 아래위로도 움직이실 수 있습니다. »

20 Things I Learned About Browsers and the Web

책처럼 만들어진 웹애플리케이션입니다. 20 Things I Learned About Browsers and the Web 구글에서 만든 것인데 인터넷과 웹의 역사, 브라우저, 웹의 동작 원리 등에 대해 알려주는 내용입니다. 내용자체도 좋지만, 책장 넘어가는 효과를 canvas로 구현했는데 예쁘고 자연스럽습니다. »

Mozilla Developer Network – 모질라 개발자 사이트

HTML과 CSS, JavaScript는 모두 웹 UI 개발(클라이언트 사이드 개발)을 하는데 필요한 개발 언어이며 하나의 웹페이지는 기본적으로 HTML만으로도 구성은 가능하지만 대부분의 웹개발은 이 세가지 언어를 혼용해서 사용하게 됩니다. 보통 퍼블리싱이라 불리는 단계에서 HTML과 CSS, 퍼블리싱 이후 기능성을 부여하는 단계에서 JavaScript를 사용하게 되는데 JavaScript 개발자가 HTML과 CSS를 잘 이해하고 있어야 함은 물론이고, 퍼블리싱을 맡은 개발자도 JavaScript를 잘알고 있다면 좋은 점이 많습니다. 결국, 웹 UI 개발자는 HTML, CSS, JavaScript를 모두 골고루 알고 있는 것이 여러 모로 좋습니다. 이 언어들을 종합적으로 공부하는데 도움이 될 만한 곳을 한 ... »

Page 7 of 7«567