유용한 라이브러리 모음
Java Script의 유용한 라이브러리들을 보아본다.
목록
- Alertify : 알람창 꾸미기
- Timepicker : input으로 시간 받기
*포스팅은 최신순이다(목록의 역순)
Timepicker
- 제이쿼리 라이브러리
- 특징 :
시간을 input으로 입력받을때 형식을 조정할 수 있다.
보통 24시간 표기가 필요할때 활용한다. - 공식사이트 :
https://timepicker.co/
<!-- Paste the following code inside the <head> element of your page: -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<!-- Paste the following code before the </body> tag: -->
<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
<script>
$(function(){
//선택자에게 timepicker();를 호출시킨다.
$('input[type="text"]').timepicker();
//호출할때 객체를 전달할 수 있다.
$('.timepicker').timepicker({
timeFormat: 'h:mm p',
interval: 60,
minTime: '10',
maxTime: '6:00pm',
defaultTime: '11',
startTime: '10:00',
dynamic: false,
dropdown: true,
scrollbar: true
});
})
</script>Alertify
- 알람창을 이쁘게 꾸며준다.
- 공식사이트 :
https://alertifyjs.com/ - 공식사이트 [Component]-[Getting Started]
CDN은 아래 5줄만 복사해온다 - 공식사이트 [Component]-[Alert]
에서 코드와 효과 등을 볼 수 있다.
<!-- JavaScript -->
<script src="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/alertify.min.js"></script>
<!-- CSS -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/alertify.min.css"/>
<!-- Default theme -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/default.min.css"/>
<!-- Semantic UI theme -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/semantic.min.css"/>
<!-- Bootstrap theme -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.13.1/build/css/themes/bootstrap.min.css"/>
<script>
alertify.alert('${alertMsg}');
</script>
'ETC' 카테고리의 다른 글
| [shortcut key] 개발툴, 편집창 단축키 (0) | 2023.05.11 |
|---|---|
| [토막정보] 다양한 개발용어 (1/2) (0) | 2023.04.13 |
| [Postman] API 개발을 위한 HTTP 통신 테스트 (0) | 2023.04.13 |
| [ERD cloud] 데이터 베이스 설계 프로그램 (0) | 2023.01.10 |
| [TIPS] 잡다한 팁 모음(VSCode, Tistory) (0) | 2022.12.26 |
댓글