트렌드나인

셀렉트 박스 이뿌게 꾸미기

<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에서 이동 됨]
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

+
제목 글쓴이 날짜 조회
18년 전 조회 2,230
18년 전 조회 5,417
18년 전 조회 4,763
18년 전 조회 3,768
18년 전 조회 3,452
18년 전 조회 2,129
18년 전 조회 2,137
18년 전 조회 3,639
18년 전 조회 2,264
18년 전 조회 2,493
18년 전 조회 1,767
18년 전 조회 4,456
18년 전 조회 2,150
18년 전 조회 2,302
18년 전 조회 4,040
18년 전 조회 3,892
18년 전 조회 2,117
18년 전 조회 2,762
18년 전 조회 5,144
18년 전 조회 2,403
18년 전 조회 2,949
18년 전 조회 8,503
18년 전 조회 1,997
18년 전 조회 2,927
18년 전 조회 2,618
18년 전 조회 2,923
18년 전 조회 2,358
18년 전 조회 2,427
18년 전 조회 2,735
18년 전 조회 3,978
18년 전 조회 2,628
18년 전 조회 2,744
18년 전 조회 3,213
18년 전 조회 2,917
18년 전 조회 2,098
18년 전 조회 2,545
18년 전 조회 2,550
18년 전 조회 4,033
18년 전 조회 4,778
18년 전 조회 2,308
18년 전 조회 2,484
18년 전 조회 2,422
18년 전 조회 3,756
18년 전 조회 2,379
18년 전 조회 2,378
18년 전 조회 1,714
18년 전 조회 1,999
18년 전 조회 2,707
18년 전 조회 3,585
18년 전 조회 3,091
18년 전 조회 2,977
18년 전 조회 2,032
18년 전 조회 4,129
18년 전 조회 2,159
18년 전 조회 4,195
18년 전 조회 2,505
18년 전 조회 2,353
18년 전 조회 3,461
18년 전 조회 2,236
18년 전 조회 2,151
18년 전 조회 3,276
18년 전 조회 3,956
18년 전 조회 2,203
18년 전 조회 2,352
18년 전 조회 3,832
18년 전 조회 2,711
18년 전 조회 3,346
18년 전 조회 2,775
18년 전 조회 1,659
18년 전 조회 2,125
18년 전 조회 3,693
18년 전 조회 2,918
18년 전 조회 2,966
18년 전 조회 3,606
18년 전 조회 2,167
18년 전 조회 2,279
18년 전 조회 3,176
18년 전 조회 1,857
18년 전 조회 2,226
18년 전 조회 2,531
18년 전 조회 1,776
18년 전 조회 2,103
18년 전 조회 1,994
18년 전 조회 2,510
18년 전 조회 1,929
18년 전 조회 1,721
18년 전 조회 1,751
18년 전 조회 1,729
18년 전 조회 2,762
18년 전 조회 1,551
18년 전 조회 5,670
18년 전 조회 2,399
18년 전 조회 1,668
18년 전 조회 4,713
18년 전 조회 2,056
18년 전 조회 4,842
18년 전 조회 3,192
18년 전 조회 2,136
18년 전 조회 1,826
18년 전 조회 2,102
🐛 버그신고