이전
목록
다음
트렌드나인

셀렉트 박스 이뿌게 꾸미기

R524
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 2007-03-17 (토) 20:22:00 · 4189
<script>
//insert_select(저장변수명,가로,폰트크기,보드색,배경색,선택색,화살표이미지);
//insert_select_option(저장변수명,폰트크기,보드색,배경색,선택색,value,view_value);

//기본셀릭트만들기
insert_select("test","100","8","F6D8B0","FFFFFF","F6D8B0","./images/menu_02/btn_select.gif");

//셀렉트 옵션추가
insert_select_option("test","8","F6D8B0","FFFFFF","F6D8B0","1","1");
insert_select_option("test","8","F6D8B0","FFFFFF","F6D8B0","2","2");
insert_select_option("test","8","F6D8B0","FFFFFF","F6D8B0","3","3","Y");
</script>

================================= js부분
//처리부분 js로 저장해서 사용하세요..^^
var zindex = 10000;

function insert_select ( sn,w,f,b,g,c,img) {
  select_count = new Array();
  select_count[sn] = 0;
  zindex--;
  document.write("    <div >");
  document.write("    <table border='0' cellspacing='1' cellpadding='1' width='"+w+"'  style='table-layout:fixed;width:"+w+";' bgcolor='"+b+"' onclick='select_click(\""+sn+"\");' >");

  document.write("    <tr>");
  document.write("        <td bgcolor='"+g+"'>");
  document.write("            <input type='text' id='"+sn+"' name='"+sn+"' style='border:none;cursor:hand;width:100%;font-size:"+f+"pt;' onselectstart=\"return false\" readonly> ");

  document.write("        </td>");
  if(img != "") {
      document.write("    <td width=18 bgcolor='"+g+"' align=center valign=bottom style='cursor:hand'><img src='"+img+"'></td>");        
  } else {
      document.write("    <td width=18 bgcolor='"+g+"' align=center valign=bottom style='cursor:hand'>v</td>");
  }
  document.write("    </tr>");
  document.write("    </table>");
  document.write("    </div>");
  document.write("<div id='"+sn+"_select_div' name='"+sn+"_select_div'  style='display:none;z-index:"+zindex+";position:absolute;'  onmouseover='"+sn+"_select_div.style.display=\"\";' onmouseout='"+sn+"_select_div.style.display=\"none\";'>");
 
  document.write("        <table border='0' cellspacing='1' cellpadding='1' bgcolor='"+b+"' width="+w+" onmouseover='"+sn+"_select_div.style.display=\"\";'>");
 
  document.write("        <tr><td bgcolor='"+g+"' style='line-height:1.3em;' id='"+sn+"_select_span'></td></tr>");
 
  document.write("        </table>");
  document.write("    </div>");
}

function insert_select_option(sn,f,b,g,c,v,vv,chk)     {
  select_count[sn] ++;    
  option_html = "<span style='width:100%;font-size:"+f+"pt' onclick='"+sn+".value=\""+v+"\";"+sn+"_select_div.style.display=\"none\";' onmouseover='this.style.background=\""+c+"\"' onmouseout='this.style.background=\""+g+"\"'>"+vv+"/"+select_count[sn] +"</span><br>";

  if(select_count[sn] == 1 || chk == "Y" ) {
      document.getElementById( sn ).value = v
  }
  document.getElementById( sn+"_select_span").innerHTML += option_html;
}

function  select_click(sn)     {    
  if ( document.getElementById( sn+"_select_div").style.display == "none") {
      document.getElementById( sn+"_select_div").style.display = "";
  } else {
      document.getElementById( sn+"_select_div").style.display = "none";
  }
}
[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]
#개발자팁 #개발자 #팁자료실 #javascript
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
10-09-25 조회 2,725
10-09-19 조회 2,762
10-09-15 조회 2,761
10-09-15 조회 4,166
10-09-15 조회 3,385
10-09-15 조회 2,495
10-09-07 조회 3,607
10-08-27 조회 4,071
10-06-11 조회 4,245
10-05-31 조회 2,494
10-02-27 조회 5,006
10-02-09 조회 3,754
09-10-10 조회 7,345
09-03-19 조회 3,204
09-02-09 조회 3,469
09-02-09 조회 4,533
08-11-01 조회 2,913
08-09-29 조회 4,565
08-09-26 조회 3,513
08-09-26 조회 3,589
08-09-26 조회 2,725
08-09-26 조회 3,769
08-09-26 조회 3,496
08-09-26 조회 4,261
08-09-18 조회 3,584
08-09-09 조회 3,235
08-08-28 조회 2,775
08-07-06 조회 3,546
08-05-21 조회 4,710
08-05-13 조회 4,544
08-04-17 조회 4,923
08-02-19 조회 3,544
08-01-18 조회 3,845
08-01-10 조회 3,823
07-10-22 조회 3,656
07-10-09 조회 4,312
07-10-03 조회 3,516
07-07-06 조회 4,215
07-07-06 조회 4,428
07-07-06 조회 4,037
07-06-28 조회 3,568
07-06-05 조회 3,576
07-06-05 조회 4,121
07-05-30 조회 3,294
07-05-02 조회 3,688
07-04-15 조회 5,149
07-04-11 조회 3,631
07-04-05 조회 3,933
07-03-31 조회 3,149
07-03-31 조회 4,124
07-03-30 조회 3,737
07-03-24 조회 4,007
07-03-22 조회 3,659
07-03-12 조회 4,414
07-02-16 조회 3,275
07-02-14 조회 5,168
07-02-10 조회 3,999
07-02-09 조회 4,389
07-01-19 조회 4,049
07-01-16 조회 4,978
06-12-16 조회 5,842
06-11-30 조회 3,602
06-11-25 조회 3,710
06-10-15 조회 5,074
06-09-26 조회 5,310
06-09-26 조회 5,428
06-09-22 조회 4,277
06-09-21 조회 3,546
06-09-21 조회 3,643
06-09-02 조회 3,486
06-08-08 조회 5,118
06-07-20 조회 3,730
06-07-17 조회 3,361
06-07-13 조회 4,183
06-07-11 조회 3,484
06-07-11 조회 3,489
06-07-11 조회 3,846
06-06-29 조회 6,072
06-06-19 조회 6,465
06-06-02 조회 3,516
06-05-24 조회 5,001
06-05-14 조회 7,780
06-05-08 조회 3,901
06-02-02 조회 5,464
05-12-16 조회 4,516
05-12-05 조회 5,165
05-06-28 조회 4,119
05-04-11 조회 4,069
05-04-11 조회 4,255
05-04-11 조회 3,319
05-03-13 조회 3,222
05-03-12 조회 4,299
04-12-08 조회 7,781
04-12-01 조회 5,186
04-11-28 조회 3,369
04-11-28 조회 3,211
04-08-05 조회 5,622
04-08-05 조회 4,975
04-08-05 조회 5,584
글쓰기