오늘부터 마감일까지의 날짜 일수 계산 0부터 해당날짜까지 카운트되며 변화하는 애니메이션 J쿼리
<h3 class="section-content-counter"><span id="counter2">0</span>개</h3>
<h3 class="section-content-counter">D-<span id="counter3">0</span></h3>
<script src="http://code.jquery.com/jquery-1.7.0.min.js"></script>
<script src="../remake/js/jquery.animateNumber.js"></script>
<script>
var today_date = new Date().toISOString().substr(0, 10).replace('T', ' '); // 오늘날짜
var end_date = "2018-06-30"; // 마감날짜
var arr1 = today_date.split('-'); // '-' 문자 제거
var arr2 = end_date.split('-');
var dat1 = new Date(arr1[0],arr1[1],arr1[2]); // 년,월,일 로드
var dat2 = new Date(arr2[0],arr2[1],arr2[2]);
var diff = dat2 - dat1; // 두 날짜의 차이 구함
var currDay = 24 * 60 * 60 * 1000; // 숫자로 표시되는 공식
var result_date = parseInt(diff/currDay); // 날짜 계산 후 숫자로 출력
var percent_number_step = $.animateNumber.numberStepFactories.append('')
$('#counter2').animateNumber({ number: 249, numberStep: percent_number_step },5000);
$('#counter3').animateNumber({ number: result_date, numberStep: percent_number_step },5000);
</script>
'jQuery' 카테고리의 다른 글
20221102_test (0) | 2022.11.02 |
---|---|
test (0) | 2022.08.31 |
J쿼리의 메서드: size(), eq(), first()/last(), index(), not(), filter(), slice(), has(), each() (0) | 2017.09.05 |
제이쿼리 스크롤메뉴 (0) | 2017.08.29 |
2. 제이쿼리 문법 기초: attr(), 클래스명 바꾸기 (0) | 2017.08.24 |