으음;; http://sayclub.com 에 보면 <select 태그가 무척 이쁘게 나오는 것을 볼 수 있습니다

전에 보니 세이클럽의 js 파일을 가져다가 쓰는 방법도 공개되었던데;; 왠지 남의 것 쓰기가 뭣 해서 한번 만들어 봤습니다.
지금 로그인해 계신분은 위에 NZEO 북마크 보시면 이해가 빠를지도;;

직접 예를 들어서 출력해보면 다음과 같이 출력됩니다


위의 소스를 직접 보면 다음과 같습니다.

<script src="http://source.phper.org/selectBox/zSelectBox.js"></script>
<script>
var testSelectBox = new Array();
var testOption = new Array();
testSelectBox["id"] = "test";
testSelectBox["bordercolor"] = "#555555";
testSelectBox["bgcolor"] = "#ffffff";
testSelectBox["fontsize"] = "9";
testSelectBox["focusbgcolor"] = "#eeeeee";
testSelectBox["bullet"] = "<img src='http://source.phper.org/selectBox/select_bul.gif' border=0>";
testOption[0] = "테스트1,1";
testOption[1] = "테스트2,2";
testOption[2] = "테스트3,3";
testOption["select"] = 0;

printZSelectBox(testSelectBox,testOption);
</script>


우선 zSelectBox.js 라는 자바스크립트 파일을 불러옵니다.
소스는 그 파일안을 보면 알 수 있기에 설명은 생략합니다
원체 허접한 소스라서 설명하기도 부끄럽네요.
사용법은 두개의 array 변수에 기본 값과 option값을 넣어 주고 printZSelectBox() 함수를 호출하면 됩니다
위에서는 testSelectBox와 testOption 이라는 array 변수를 사용하였는데,
원하시는 이름으로 바꾸시면 됩니다
testSelectBox에는 몇가지 지정할 수 있는 항목이 있습니다
id 키는 가장 중요한 것인데, 이 부분은 <input type=hidden name=id값>폼을 몰래 만들어서 form에서 값을 넘길때
사용할 수 있습니다

- 위에 testSelectBox에서 사용되는 설정값을 정리해 보면 아래와 같습니다

id : selectBox의 id를 지정 (id이름으로 hidden 폼을 생성하여 선택되는 값을 입력한다)
width : selectBox의 가로크기를 지정 (절대값이나 %를 붙인 상대값 사용가능;;)
height : 높이 지정 (역시 절대/상대값 사용하면 됨)
bordercolor : 테두리 색깔을 지정
bgcolor : 배경 색깔 지정
fontcolor : 글자 색깔 지정
focusbgcolor : 선택되었을때 배경 색깔
fontsize : 글자의 크기 (숫자만 넣어야 함. 예를 들어 8을 넣으면 8pt가 됨;)
padding : cellpadding의 값을 정함
bullet : 오른쪽 화살표, <img src=...>등의 이미지도 되고, - 같은 텍스트 넣어도 됨
onChange : selectBox에서 많이 쓰는 onChange 이벤트가 일어날때 페이지 이동을 해야 할 경우 [onChange]=true를 입력하면 됨;
     (이 경우에는 option의 value값에 url을 입력하면 됨)

- 그리고 testOption에서는 0 부터 원하는 option값을 추가하면 됩니다
name과 value를 , 로 연결해서 지정하면 됩니다.
예를 들어
이름
은
testOption[0] = "이름,값";
으로 하면 되죠;
(참 허접한 지정입니다만;; 간편한 사용을 위해서 그런 것이니 이해를;;)
만약 option의 초기값을 사용하고 싶은 경우에는;; testOption["select"]=0; 처럼 select 키에 인덱스값을 지정하면 됩니다

새벽에 갑자기 생각이 나서 바로 코딩한거라서 참 허접한 소스지만 혹시 필요하신 분이 계실까 해서 올립니다

악플은 사양하며; 저작권이고 뭐고 없으니 필요하시면 가져다가 이쁘게 사용해 주세요
기능 개선해서 공개해주시는 것 역시 환영합니다

* js 파일은 http://source.phper.org/selectBox/zSelectBox.js 에서 받아가세요;