이전
목록
다음
트렌드나인

셀렉트 박스 이뿌게 꾸미기

R524
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 18년 전 · 3232
<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
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
18년 전 조회 2,378
18년 전 조회 5,576
18년 전 조회 4,900
18년 전 조회 3,914
18년 전 조회 3,610
18년 전 조회 2,284
18년 전 조회 2,276
18년 전 조회 3,790
18년 전 조회 2,412
18년 전 조회 2,638
18년 전 조회 1,910
18년 전 조회 4,618
18년 전 조회 2,307
18년 전 조회 2,447
18년 전 조회 4,187
18년 전 조회 4,046
18년 전 조회 2,277
18년 전 조회 2,923
18년 전 조회 5,303
18년 전 조회 2,551
18년 전 조회 3,104
18년 전 조회 8,662
18년 전 조회 2,146
18년 전 조회 3,079
18년 전 조회 2,752
18년 전 조회 3,082
18년 전 조회 2,506
18년 전 조회 2,596
18년 전 조회 2,884
18년 전 조회 4,127
18년 전 조회 2,783
18년 전 조회 2,886
18년 전 조회 3,345
18년 전 조회 3,073
18년 전 조회 2,255
18년 전 조회 2,704
18년 전 조회 2,694
18년 전 조회 4,178
18년 전 조회 4,919
18년 전 조회 2,470
18년 전 조회 2,632
18년 전 조회 2,559
18년 전 조회 3,908
18년 전 조회 2,524
18년 전 조회 2,535
18년 전 조회 1,859
18년 전 조회 2,151
18년 전 조회 2,869
18년 전 조회 3,743
18년 전 조회 3,233
18년 전 조회 3,122
18년 전 조회 2,175
18년 전 조회 4,282
18년 전 조회 2,304
18년 전 조회 4,337
18년 전 조회 2,667
18년 전 조회 2,502
18년 전 조회 3,607
18년 전 조회 2,391
18년 전 조회 2,320
18년 전 조회 3,417
18년 전 조회 4,107
18년 전 조회 2,343
18년 전 조회 2,489
18년 전 조회 3,992
18년 전 조회 2,871
18년 전 조회 3,495
18년 전 조회 2,920
18년 전 조회 1,820
18년 전 조회 2,280
18년 전 조회 3,825
18년 전 조회 3,068
18년 전 조회 3,133
18년 전 조회 3,748
18년 전 조회 2,309
18년 전 조회 2,418
18년 전 조회 3,318
18년 전 조회 2,013
18년 전 조회 2,379
18년 전 조회 2,679
18년 전 조회 1,919
18년 전 조회 2,251
18년 전 조회 2,138
18년 전 조회 2,668
18년 전 조회 2,086
18년 전 조회 1,880
18년 전 조회 1,905
18년 전 조회 1,893
18년 전 조회 2,898
18년 전 조회 1,708
18년 전 조회 5,808
18년 전 조회 2,552
18년 전 조회 1,804
18년 전 조회 4,856
18년 전 조회 2,195
18년 전 조회 4,988
18년 전 조회 3,352
18년 전 조회 2,275
18년 전 조회 1,973
18년 전 조회 2,255
이전 첫 페이지 다음
글쓰기