올만에 브라우저단 작업 왕삽질 - html, css, jquery

블로그 외의 목적으로 html, css 를 접해본지는 정말 오래되었다.

아주 오래전엔 디자이너쪽에서 작업해준 html 단에 프로그램을 입혀보았으나
이후에는 Grid 제품, X-Internet 제품 등 을 써왔고
일반 브라우저 대상으로한 웹App 개발때에도 서버단 개발만 주로 하다보니...

일단 큰 레이아웃, 메뉴, 버튼을 서핑해가면서 좀 작업을 했다.

앞으로도 서핑과 예전 소스 참고해서 작업을 해야할거 같다.

** 삽질 사례 1

모 사이트를 참고해서 레이아웃과 DropDown 메뉴 작업을 하려고 했는데...
잘 되어있긴 한데... CSS내용과 html 이 너무 복잡 방대했음.
하다보니 좀 아닌데 싶었으나... 시작한 한김에 뿌리뽑고자 꽤 시간을 들여 하다가
이건 아니다 싶어서 완전히 접음 

이후 간단한 샘플
에 직접 Dropdown 메뉴 구현 시도

** 삽질 사례 2
IETester ( http://www.my-debugbar.com/wiki/IETester/HomePage ) 를 통해 ie7, 8 호환여부 확인하면서 작업을 했는데, 특히 DropDown 메뉴 관련해서 이런저런거 참고해서 직접 삽질해서 다 만들었다.

그런데 ieTester 에서는 잘 보이던것이
ie9 의 개발자 도구 (F12 누르면 나옴) 에서는 깨지는 것이다...

실제 ie7, 8 로 하면 어찌될 진 모르지만... ie의 개발자도구를 믿기로 하고...
직접 코딩한 DropDown 메뉴는 일단 보류했음.  

   ▶ http://www.dynamicdrive.com/  쪽 참고해서 jquery 기반의 메뉴 적용.

* jquery 
장애해결이나 기술지원때 jquery 쓰는 App 를 들여다본적은 있는데
내가 직접 이용해보기는 처음인거 같다

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
요런 코드가 있는데 (뭐 전에도 구경한 적은 있다 )

js가
http://code.jquery.com/jquery-1.7.2.min.js
http://code.jquery.com/jquery-1.7.2.js 

위와같이 min 이 붙은게 있고 아닌게 있어서 뭔가 했다.

min : Minified version --- 한줄로 쭉 붙인다 또는 공통화를 통해 코딩의 반복을 줄여 코드량 줄인 버젼인듯
min 아닌거 ---  Development (Full) version 

즉 소스상에는 min 버젼을 삽입해놓고 쓰면 되고,
뭔가 들여다 보고 싶을때 또는 커스터마이징 필요시에는 Full Version을 쓰면 될듯함.

---

♣  css sample 있는곳 ( javascript 샘플도 있을거 같음)  http://www.dynamicdrive.com/