새소식

Front

[jQuery] 달력만들기, 두 번 클릭으로 구현되는 세상에서 가장 쉬운 달력 flatpickr

  • -
728x90

안녕하세요. 이사작전.com의 개발자 말랑고양입니다. 오늘은 달력만드는 방법을 공유하려합니다.

Bootstrap을 사용하지 않은 달력입니다. 여러가지 추가 옵션들도 많고, 앞으로 저는 이것을 사용하게 될 것 같습니다.



1. 첫 번째 Ctrl + c v

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>



2. 두 번째 Ctrl + c v

$(".selector").flatpickr({
  enableTime: true,
  dateFormat: "Y-m-d H:i",
});



구현 끝.


flatpickr 공식 홈페이지 : https://flatpickr.js.org/getting-started/

맨날 달력 구현에 애를 먹었었는데, 외국인 아저씨가 좋은 것을 만들어주셨군요. 옵션도 이것저것 많습니다. 아주 복잡한 달력 기능을 요구하는 프로젝트가 아니라면 flatpickr 선택은 정답입니다. 라이센스도 MIT를 걸어주셨습니다.

이사할 땐, 이사작전.com


도움이 되셨다면 "공감" 한번씩 눌러주세요.

궁금한 점이 있다면 언제든지 댓글 남겨주세요. 감사합니다.


#jQuery #만들기 #쉬운 #달력 #css #flatpickr


reference : https://flatpickr.js.org/getting-started/

reference : https://github.com/flatpickr/flatpickr


반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.