자바스크립트 네비게이션

CSS를 주로 다루는 사이트는 웹페이지의 네비게이션를 제작할 때, 당연히 CSS로 표현하라고 권한다. 어쩔 수 없는 경우에는 자바스크립트를 사용하라고 한다. 플래시에 대한 언급은 거의 없다.

CSS Reboot에 소개되어 있는 사이트들을 구경하던 중, 심플한 디자인의 Monolinea이 눈에 들어왔다. 다이나믹한 네비게이션을 플래시가 아닌 자바스크립트를 이용하여 표현하고 있었다.

국내 사이트들의 경우에는 대부분의 사이트들이 플래시로 네비게이션으로 표현한다. 이 사이트를 보기 전까지만 해도, 다이나믹한 네비게이션은 플래시로만 만드는 줄 알았다. 물론 자바스크립트 콘솔로 확인해보니 몇몇 에러와 1개의 경고가 나오긴 하지만, 자바스크립트로 흔히 볼 수 있는 플래시 네비게이션과 흡사하게 표현할 수 있다는 점이 놀라울 뿐이다.

사이트를 둘러보면, 비단 네비게이션 뿐만 아니라 이미지 블러/알파 등 여러 부분에서 자바스크립트 만으로 다양한 효과를 나타내고 있다.

자바스크립트와 같은 프로그래밍에 개념이 부족한 나만 이렇게 신기한 걸까? 어쨓든 놀랍고 신기한 건 사실이다.



6개의 의견이 있습니다. | 당신의 의견을 바랍니다.

  1. 1. Gravatar 쿠키~* | 2005.05.06 , 오후 05:37 · permallink

    저도 저 사이트 보고 메뉴 따라해 봐야지 하고 클립해뒀는뎅..
    자바스크립은 너무 어려워요 @_@)

  2. 2. Gravatar hooney | 2005.05.07 , 오전 12:02 · permallink

    쿠키님도 저랑 같은 과였네요.

    저는 예전에 플래시를 다룰때 액션스크립트를 사용해 봤음에도 불구하고, 자바스크립트는 너무 어렵더라구요. give up했습니다. ㅡ.ㅡ;

  3. 3. Gravatar jay | 2005.05.07 , 오전 03:10 · permallink

    사파리에선 약간 문제가 생기는군요

  4. 4. Gravatar hooney | 2005.05.07 , 오전 10:44 · permallink

    확인해보니 오페라에서도 문제가 발생합니다. ^^;

    제 블로그도 브라우저 테스트를 해보니 FF에서는 제대로 보이지만, IE6에서는 몇몇 문제가 발생하고, 오페라에서는 1280×1024 해상도에서 전체화면 보기를 하면 % 넓이값에 문제가 발생하네요. ㅜ.ㅜ

  5. 5. Gravatar 일모리 | 2005.05.08 , 오전 12:13 · permallink

    % 의 도의 경지에 이번기회를 통해서 오르시겠군요 :)

  6. 6. Gravatar hooney | 2005.05.08 , 오후 08:02 · permallink

    어쨓든 이번 시도를 통해서 새로운 경험을 많이 쌓게 됐네요. ^^;

당신의 의견을 기다립니다.

사용할 수 있는 HTML 태그 : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>



Aboout Author

조훈 Hooney라는 ID로 온라인에서 활동하는 조훈입니다.
자세히 보기 »

CSS Reference

Hooney와 함께 만드는 CSS Reference!


Be Friend~! 웹 접근성 향상 캠페인