트렌드나인

셀렉트 박스 이뿌게 꾸미기

· 2007-03-17 (토) 20:22:00 · 4174
<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에서 이동 됨]
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
08-01-27 조회 3,805
08-01-26 조회 8,564
08-01-21 조회 3,314
08-01-08 조회 3,766
07-12-21 조회 4,706
07-12-14 조회 4,860
07-12-13 조회 6,307
07-12-10 조회 4,099
07-12-03 조회 3,252
07-12-03 조회 4,294
07-11-27 조회 5,790
07-11-26 조회 2,996
07-11-22 조회 5,113
07-11-21 조회 3,326
07-11-21 조회 1.1만
07-11-12 조회 4,072
07-11-07 조회 4,834
07-10-29 조회 3,584
07-10-25 조회 4,999
07-10-24 조회 3,792
07-10-23 조회 5,982
07-10-09 조회 4,147
07-10-09 조회 4,605
07-10-09 조회 3,202
07-10-09 조회 3,561
07-09-27 조회 3,863
07-09-27 조회 3,089
07-09-15 조회 4,016
07-09-13 조회 2,789
07-09-13 조회 3,249
07-08-07 조회 3,278
07-08-04 조회 3,424
07-07-30 조회 5,424
07-07-29 조회 3,789
07-07-29 조회 4,458
07-07-21 조회 3,101
07-07-20 조회 3,147
07-07-20 조회 4,314
07-07-07 조회 3,387
07-07-06 조회 5,211
07-07-06 조회 5,608
07-07-05 조회 6,747
07-07-04 조회 3,382
07-06-11 조회 3,901
07-06-04 조회 7,243
07-05-28 조회 4,874
07-05-14 조회 6,340
07-05-10 조회 5,287
07-05-09 조회 3,388
07-05-04 조회 3,685
07-04-27 조회 3,329
07-04-25 조회 4,648
07-04-19 조회 3,612
07-04-16 조회 3,219
07-04-13 조회 3,837
07-04-12 조회 4,559
07-04-12 조회 4,773
07-04-11 조회 3,403
07-04-08 조회 5,132
07-04-07 조회 3,236
07-03-29 조회 3,542
07-03-27 조회 3,750
07-03-21 조회 5,146
07-03-15 조회 3,283
07-03-11 조회 3,301
07-03-10 조회 4,939
07-03-09 조회 3,942
07-03-08 조회 4,824
07-03-05 조회 2,944
07-03-02 조회 3,033
07-03-02 조회 3,872
07-02-26 조회 2,920
07-02-26 조회 3,013
07-02-23 조회 4,262
07-02-23 조회 3,329
07-02-23 조회 3,331
07-02-23 조회 3,514
07-02-22 조회 3,152
07-02-21 조회 4,804
07-02-20 조회 4,605
07-02-14 조회 3,751
07-02-12 조회 5,341
07-02-11 조회 4,774
07-02-10 조회 4,079
07-02-09 조회 3,853
07-02-08 조회 4,519
07-02-03 조회 4,115
07-02-02 조회 3,489
07-01-09 조회 3,576
07-01-08 조회 3,948
06-12-26 조회 4,643
06-12-21 조회 3,751
06-12-15 조회 4,162
06-12-15 조회 7,440
06-12-15 조회 3,170
06-12-15 조회 3,189
06-12-15 조회 3,463
06-12-15 조회 3,120
06-12-15 조회 4,540
06-12-15 조회 3,137