본문 바로가기

개발

[jQuery/Javascript] 달력 datepicker v1.2

작성자 : ahmax(ahmax95@gmail.com)
작성일 : 2011.03.17
http://beans9.tistory.com

- jQuery를 이용해서 만든 달력입니다.



특징

  • 달력위에서 스크롤로 월단위 이동가능
  • 간단한 사용방법
  • 현재 날짜는 파란박스로 표시
  • 선택되어진 날짜는 빨간박스로 표시
  • IE,Chrome,FF 지원

업데이트 내용

  • FF에서 메인화면가 같이 스크롤되던 현상 수정
  • 스크롤시 2개월씩 이동하던 현상 수정
  • 커서가 정상적으로 표시되도록 수정
  • IE,FF에서 드래그가 안되도록 수정 (크롬은 테스트중)


사용방법

  • 필요한 js,css파일 import후 아래와 같이 javascript로 호출하여 사용
<script src="./jquery-1.4.4.min.js"></script>
<script src="./jquery.mousewheel.min.js"></script>
<script src="./calendar_ahmax.js"></script>
<link rel='stylesheet' href='./calendar_ahmax.css' type='text/css' />
...
<input type="text" id="cal">
<script type="text/javascript">
 <!--
  initCal("cal1");     
 //-->
 </script> 


최대년수/날짜구분자 수정방법

  • calendar_ahmax.js 파일을 수정
   // 최대연수 (0으로 할경우 현제 년도까지)
   var max_year = 2020;
   
   // 최소연수
   var min_year = 2005;
   
   // 날짜표시형식 (xxxx-xx-xx) .이나 /로 변경가능합니다. 
   var date_split_format = "-";

사용에는 제한이 없으니 마음껏 사용하시고 피드백부탁드립니다.
퍼가실경우 출처를 밝혀주시기 바랍니다.

http://beans9.tistory.com