메뉴 건너뛰기

조회 수 6432 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
<style type="text/css">
 .eventWrap div.inNumber{margin-bottom:30px;}
 .eventWrap div.inNumber:after{content:'';display:block;clear:both;}
 .eventWrap div.inNumber input{float:left;width:616px;height:73px;line-height:73px;margin-right:20px;padding:0;border:1px solid #cfcfcf;background:#f2f2f2;text-align:center;color:#444343;font-size:24px;}
 .eventWrap div.inNumber div.selectbox {float:left;position: relative;width: 277px;height:73px;line-height:73px;border: 1px solid #cfcfcf;background:#fbfbfb url('./images/sel_off.gif') no-repeat 219px 50%;;z-index: 1;font-size:24px;}
 .eventWrap div.inNumber div.selectbox label{position: absolute; top: 1px;left: 30px;width:243px;height:73px;line-height:73px; color: #999;z-index: -1;}
 .eventWrap div.inNumber div.selectbox select {width: 100%;height:73px;line-height:73px;font-family: inherit;border: 0;opacity: 0;filter:alpha(opacity=0);-webkit-appearance: none;-moz-appearance: none;appearance: none;}
 .eventWrap .smsPoint{width:912px;padding:105px 0 32px 0;margin-bottom:20px;border:3px solid #f92828;background:url('./images/tit_point_save.gif') no-repeat 0 0;}
 .eventWrap .smsPoint .txtSms{text-align:center;font-size:18px;line-height:26px;margin-bottom:26px;}
 .eventWrap .smsPoint .smsChk{position:relative;text-align:center;}
 .eventWrap .smsPoint .smsChk label{display:inline-block;padding:0 0 0 44px;height:33px;line-height:33px;font-size:25px;color:#000;background:url('./images/bg_checkbox.png') no-repeat 0 0;}
 .eventWrap .smsPoint .smsChk label.on{background-position:0 100%;}
 .eventWrap .smsPoint .smsChk input{position:absolute;top:0px;left:0px;width:315px;height:33px;opacity: 0;filter:alpha(opacity=0);}
 </style>


<div class="inNumber">
   <input type="text" id="inNumber" name="" value="인증번호 8자리 입력(-제외)" />
   <div class="selectbox">
    <label for="labelSel">적립 받을 달 선택</label>
    <select id="labelSel">
     <option>적립 받을 달 선택</option>
     <option>12월</option>
     <option>11월</option>
     <option>10월</option>
     <option>9월</option>
     <option>8월</option>
    </select>
   </div>  
  </div>

  <div class="smsPoint">
   <p class="txtSms">고객님이 잊지 않으시도록 선택하신 달에 고객님께 적립금 지급을 알려드립니다. <br />SMS 수신동의를 해주시기 바랍니다.</p>
   <p class="smsChk">
    <label for="smsAgree">SMS 안내받기 (수신동의)</label>
    <input type="checkbox" id="smsAgree" class="inCheck" />
   </p>
  </div>
  <p class="btnC mb55"><a href="#"><img src="./images/btn_point_save.gif" alt="적립금 받기" /></a></p>
<script type="text/javascript">
 $(document).ready(function() {
  $('#inNumber').on('focus', function(){
   $(this).val('');
  });
  var selectTarget = $('.selectbox select');
  selectTarget.change(function(){
   var select_name = $(this).children('option:selected').text();
   $(this).siblings('label').text(select_name);
  });

  $('.smsChk input').on('click', function(){
   var $this = $(this).parent().find('label');
   if($('#smsAgree').is(':checked')){
    $this.addClass('on');
    //console.log(0);
    //console.log($('#smsAgree').is(':checked'));
   } else {
    $this.removeClass('on');
    //console.log(1);
    //console.log($('#smsAgree').is(':checked'));
   }
  });

 });
 </script>



  1. No Image 22Dec
    by
    2016/12/22 Views 7834 

    하단 고정 레이어 스타일(CSS) 따라하기

  2. No Image 22Dec
    by
    2016/12/22 Views 6968 

    항상 레이어가 정 가운데 위치하는 스크립트

  3. No Image 22Dec
    by
    2016/12/22 Views 6563 

    scrolling to top

  4. Ajax를 이용한 데이터 조회시 로딩 로딩 이미지 보이기(jquery이용)

  5. No Image 22Dec
    by
    2016/12/22 Views 6284 

    금액단위 제거 표기

  6. No Image 22Dec
    by
    2016/12/22 Views 7193 

    시간 카운트

  7. No Image 22Dec
    by 조쉬
    2016/12/22 Views 6432 

    디자인 셀렉트 박스 & CSS

  8. No Image 22Dec
    by
    2016/12/22 Views 8425 

    흐르는 배너 만들기2

  9. No Image 22Dec
    by
    2016/12/22 Views 10379 

    bxslider 멈춤현상

  10. No Image 22Dec
    by
    2016/12/22 Views 49862 

    jquery 플러그인 링크 모음

  11. No Image 18Nov
    by
    2016/11/18 Views 7284 

    html 테이블 고정 (table fixed)

  12. No Image 18Nov
    by
    2016/11/18 Views 7192 

    이미지 클릭 손 (cursor:pointer)

  13. No Image 18Nov
    by
    2016/11/18 Views 7018 

    jQuery Selector (셀렉터)

  14. 날짜 검색 범위 정하기 (jquery)

  15. No Image 17Nov
    by
    2016/11/17 Views 10147 

    jQuery 날짜 비교 (날짜비교)

  16. jQuery 카테고리 선택에 따른 하위 카테고리 변경 (selecbox)

  17. No Image 17Nov
    by
    2016/11/17 Views 10116 

    jquery radio checked (라디오 버튼 값으로 선택), 검색 조건 초기 셋팅

  18. No Image 17Nov
    by
    2016/11/17 Views 6576 

    jquery 뒤로가기

  19. No Image 17Nov
    by
    2016/11/17 Views 8622 

    jQuery tr 추가 (입력창 추가), jQuery 테이블 행 추가/삭제, selector last name

  20. No Image 17Nov
    by
    2016/11/17 Views 7024 

    jQuery, JavaScript 새로고침(reload)

Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved