jQuery : jQuery.countdown 카운트 다운 count down 라이브러리
jQuery.countdown 카운트 다운 count down 라이브러리
CIO’s Future of Cloud Summit November 8, 2022 사이트에 카운트 다운 부분이 보여서 코드를 봤더니 http://hilios.github.io/jQuery.countdown/ 사이트에서 운영하는 라이브러리를 사용하는것을 발견하여 이를 조사해 봤습니다.
http://hilios.github.io/jQuery.countdown/ 에서 운영하는 샘플 예제가 상당히 많고 활용도가 높습니다.
이를 사용하고 한다면, jQuery 라이브러리를 참조하여, 아래와 같이 format 형태를 요청하면 그에 맞게 카운팅을 해서 보여줍니다.!!
<!DOCTYPE html>
<html>
<head>
<script src="jquery.min.js"></script>
<script src="jquery.countdown.min.js"></script>
</head>
<body>
<div class="example-base">
Limited Time Only!
<span id="clock"></span>
</div>
</body>
<script type="text/javascript">
$('#clock').countdown('2022/11/23 01:00:00').on('update.countdown', function(event) {
var format = '%H:%M:%S';
if(event.offset.totalDays > 0) {
format = '%-d day%!d ' + format;
}
if(event.offset.weeks > 0) {
format = '%-w week%!w ' + format;
}
$(this).html(event.strftime(format));
}
).on('finish.countdown', function(event) {
$(this).html('This offer has expired!')
.parent().addClass('disabled');
});
</script>
</html>
다양한 예제들
http://hilios.github.io/jQuery.countdown/examples/month-and-week-offset.html
Months and weeks offsets - jQuery.countdown
Display the possibles days offsets %n, %d and %D regarging the months, weeks and the total amount of the days until the finish date. New year's eve in months: HTML: JS: $('#wrapper').countdown('2020/10/10', function(event) { $('#clock-a').html(event.strfti
hilios.github.io