Web Designer Wall의 Nick La씨는 CSS3를 이용하여 위와 같은 아름다운 드롭다운 네비게이션을 구현했습니다. 더불어 CSS3를 지원하지 않는 브라우저에서도 최소한의 모습을 유지하고 정상적으로 동작하도록 만들었습니다. :hover
액션을 적절히 사용하여 자바스크립트를 사용하지 않고도 서브메뉴 출력과 포커스 효과를 훌륭하게 구현으며, CSS3를 지원하는 브라우저인 경우 border-radius
, box-shadow
, text-shadow
속성이 활성화 되어 마치 그래픽 디자인한 듯한 느낌을 받게 됩니다. 놀랍게도 가로 1px짜리 반투명 png 이미지를 하나만 사용하여 여러 요소의 background
속성에 범용으로 사용하는 모습은 매우 인상적입니다.
Comments
Got something to add? You can just leave a comment.
말이 필요 없어요. 최곱니다! RT @firejune: CSS3로 만든 아름다운 드롭다운 네비게이션 http://firejune.com/1559
from Topsy
RT @ahastudio: 말이 필요 없어요. 최곱니다! RT @firejune: CSS3로 만든 아름다운 드롭다운 네비게이션 http://firejune.com/1559
from Topsy
플래시스러운 메뉴 네비게이션. 그러나 플래시는 전혀 사용하지 않고 CSS3를 사용하여 만들었다고 하네요. http://firejune.com/1559 탈플래시를 위한 노력의 결과라고나 할까요? 이러닝을 위한 이런 유형의 패키지가 나왔으면 좋겠네요.
from Topsy
Your Reaction Time!