웹개발에 필요한 정보: HTML, CSS, JavaScript, etc.
Smooth Scroll to Top Using CSS3 Animations http://labs.mitgux.com/smooth-scroll-to-top-using-css3-animations/ CSS3 animation을 사용해서 부드럽게 페이지 맨 위로 스크롤하는 데모입니다. 위 URL을 방문해보시면 소스안에있는 goTop.js 파일에서 CSS3 transition과 easing 효과를 사용하고 있습니다. Check out this Pen! »
HINT.css http://kushagragour.in/lab/hint/ 툴팁을 만들어주는 CSS 라이브러리입니다. data-* attribute, pseudo elements, content property, CSS3 transitions 를 사용해서 툴팁을 만듭니다. 아래의 데모에서 텍스트 위에 마우스를 올려보세요 Check out this Pen! »
All you need to know about CSS Transitions http://blog.alexmaccaw.com/css-transitions CSS Transition 에 대해 자세히 설명한 글입니다. »
CSS Load.net http://cssload.net/ Ajax 데이터 로드되는 동안이나 이미지 로드되는 동안 보여줄 빙글빙글 돌아가는 이미지들, 또는 Loading… 등의 이미지를 애니메이션되게 움직이게 하는 데 사용되는 CSS3 코드를 생성해 주는 서비스입니다. 제공되는 종류가 매우 많은데 몇 가지 데모를 아래에 넣어봤습니다. Check out this Pen! »
The ultimate “target retina screens” media query http://mir.aculo.us/2012/11/28/the-ultimate-target-retina-screens-media-query/ 아이폰, 아이패드 등 레티나 디스플레이가 사용되고 있는 기기에 적용되는 media query 입니다. @media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) { /* Retina rule... »
Recent Comments