이전
목록
다음
트렌드나인

셀렉트 박스 이뿌게 꾸미기

R524
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 18년 전 · 3226
<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,575
18년 전 조회 4,896
18년 전 조회 3,911
18년 전 조회 3,607
18년 전 조회 2,281
18년 전 조회 2,273
18년 전 조회 3,787
18년 전 조회 2,410
18년 전 조회 2,637
18년 전 조회 1,905
18년 전 조회 4,614
18년 전 조회 2,305
18년 전 조회 2,444
18년 전 조회 4,185
18년 전 조회 4,040
18년 전 조회 2,277
18년 전 조회 2,919
18년 전 조회 5,300
18년 전 조회 2,548
18년 전 조회 3,104
18년 전 조회 8,657
18년 전 조회 2,144
18년 전 조회 3,073
18년 전 조회 2,749
18년 전 조회 3,077
18년 전 조회 2,503
18년 전 조회 2,595
18년 전 조회 2,879
18년 전 조회 4,126
18년 전 조회 2,782
18년 전 조회 2,881
18년 전 조회 3,339
18년 전 조회 3,069
18년 전 조회 2,254
18년 전 조회 2,697
18년 전 조회 2,694
18년 전 조회 4,174
18년 전 조회 4,915
18년 전 조회 2,469
18년 전 조회 2,629
18년 전 조회 2,556
18년 전 조회 3,907
18년 전 조회 2,517
18년 전 조회 2,535
18년 전 조회 1,854
18년 전 조회 2,149
18년 전 조회 2,863
18년 전 조회 3,740
18년 전 조회 3,227
18년 전 조회 3,121
18년 전 조회 2,174
18년 전 조회 4,276
18년 전 조회 2,301
18년 전 조회 4,331
18년 전 조회 2,665
18년 전 조회 2,498
18년 전 조회 3,601
18년 전 조회 2,387
18년 전 조회 2,316
18년 전 조회 3,414
18년 전 조회 4,103
18년 전 조회 2,340
18년 전 조회 2,487
18년 전 조회 3,988
18년 전 조회 2,869
18년 전 조회 3,493
18년 전 조회 2,920
18년 전 조회 1,820
18년 전 조회 2,279
18년 전 조회 3,823
18년 전 조회 3,062
18년 전 조회 3,128
18년 전 조회 3,745
18년 전 조회 2,306
18년 전 조회 2,417
18년 전 조회 3,314
18년 전 조회 2,009
18년 전 조회 2,376
18년 전 조회 2,679
18년 전 조회 1,915
18년 전 조회 2,249
18년 전 조회 2,134
18년 전 조회 2,661
18년 전 조회 2,081
18년 전 조회 1,876
18년 전 조회 1,901
18년 전 조회 1,890
18년 전 조회 2,894
18년 전 조회 1,705
18년 전 조회 5,802
18년 전 조회 2,551
18년 전 조회 1,799
18년 전 조회 4,854
18년 전 조회 2,191
18년 전 조회 4,987
18년 전 조회 3,351
18년 전 조회 2,272
18년 전 조회 1,969
18년 전 조회 2,249
이전 첫 페이지 다음
글쓰기