이전
목록
다음
트렌드나인

셀렉트 박스 이뿌게 꾸미기

R524
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 18년 전 · 3259
<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,399
18년 전 조회 5,604
18년 전 조회 4,921
18년 전 조회 3,929
18년 전 조회 3,642
18년 전 조회 2,307
18년 전 조회 2,301
18년 전 조회 3,814
18년 전 조회 2,438
18년 전 조회 2,666
18년 전 조회 1,931
18년 전 조회 4,638
18년 전 조회 2,333
18년 전 조회 2,466
18년 전 조회 4,213
18년 전 조회 4,073
18년 전 조회 2,302
18년 전 조회 2,940
18년 전 조회 5,326
18년 전 조회 2,580
18년 전 조회 3,133
18년 전 조회 8,686
18년 전 조회 2,172
18년 전 조회 3,094
18년 전 조회 2,781
18년 전 조회 3,105
18년 전 조회 2,526
18년 전 조회 2,623
18년 전 조회 2,908
18년 전 조회 4,152
18년 전 조회 2,810
18년 전 조회 2,904
18년 전 조회 3,371
18년 전 조회 3,095
18년 전 조회 2,280
18년 전 조회 2,724
18년 전 조회 2,712
18년 전 조회 4,193
18년 전 조회 4,942
18년 전 조회 2,497
18년 전 조회 2,654
18년 전 조회 2,586
18년 전 조회 3,936
18년 전 조회 2,545
18년 전 조회 2,557
18년 전 조회 1,881
18년 전 조회 2,172
18년 전 조회 2,893
18년 전 조회 3,770
18년 전 조회 3,260
18년 전 조회 3,143
18년 전 조회 2,203
18년 전 조회 4,305
18년 전 조회 2,330
18년 전 조회 4,359
18년 전 조회 2,687
18년 전 조회 2,522
18년 전 조회 3,625
18년 전 조회 2,409
18년 전 조회 2,349
18년 전 조회 3,445
18년 전 조회 4,127
18년 전 조회 2,365
18년 전 조회 2,515
18년 전 조회 4,012
18년 전 조회 2,896
18년 전 조회 3,523
18년 전 조회 2,950
18년 전 조회 1,840
18년 전 조회 2,305
18년 전 조회 3,855
18년 전 조회 3,094
18년 전 조회 3,162
18년 전 조회 3,774
18년 전 조회 2,329
18년 전 조회 2,450
18년 전 조회 3,351
18년 전 조회 2,035
18년 전 조회 2,400
18년 전 조회 2,704
18년 전 조회 1,940
18년 전 조회 2,276
18년 전 조회 2,158
18년 전 조회 2,687
18년 전 조회 2,109
18년 전 조회 1,907
18년 전 조회 1,938
18년 전 조회 1,920
18년 전 조회 2,930
18년 전 조회 1,734
19년 전 조회 5,833
19년 전 조회 2,571
19년 전 조회 1,828
19년 전 조회 4,875
19년 전 조회 2,220
19년 전 조회 5,009
19년 전 조회 3,379
19년 전 조회 2,301
19년 전 조회 1,997
19년 전 조회 2,282
이전 첫 페이지 다음
글쓰기