본문 바로가기

web's

광고

Design

Reference

Tutorial

웹 표준 사이트 만들기
반응형 웹 사이트 만들기
패럴럭스 배우기

CSS

NEWS

SITE

Coding

광고

마우스오버

[Hover] 마우스 오버하면 펼쳐지는 메모지 CSS3 만들기 이 소스의 핵심은 #Awesome:hover h4{ opacity: 0; transition: opacity 50ms linear 300ms;} #Awesome:hover .front .circle{ margin-top: -90px; background-color: #e2d439; background-position: 0 100px;} 마우스 오버시 transition을 어떻게 주는가에 있겠죠^^생각보다 어렵지 않아서 소스보시면 도움이 될거예요~ See the Pen Pure CSS Peeling Sticky by patrickkunka (@patrickkunka) on CodePen.
[HTML/CSS] CSS3를 통한 자막(Caption) 오바 효과 만들기 CSS3를 통한 자막(Caption) 오바 효과 만들기 Caption Hover Effects [미리보기][목록보기] CSS3를 통해서 다양한 오버효고를 보여주는 튜토리얼입니다. CSS3를 통해 만들었기 때문에 구 익스플로러에서는 작동 안된다는거~~ 크로스브라우징까지 생각하신다면 제이쿼리 쪽에서 알아보세요^^
[CSS3/HTML5] CSS3를 이용한 희미한 주석효과 코딩하기 CSS3를 이용한 희미한 주석효과 코딩하기[Annotation Overlay Effect with CSS3]