카운트다운 스크립트
작업중에 팁 공유합니다~ ^^
지정한 날짜/시간/분/초 까지 남은시간을 실시간 카운트 해줍니다.
남은시간이 없는 경우 종료문구 포함되어 있습니다.
경매 등에 사용하면 좋을것 같습니다~
Script
[code]
<script>
CountDownTimer('12/20/2019 00:00', 'countdown');
//시간 지정시
//CountDownTimer('01/01/2020', 'countdown');
//시간 필요없는 경우 대체
function CountDownTimer(dt, id)
{
var end = new Date(dt);
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;
function showRemaining() {
var now = new Date();
var distance = end - now;
if (distance < 0) {
clearInterval(timer);
document.getElementById(id).innerHTML = '경매종료'; // 종료시 보일 문구
return;
}
var days = Math.floor(distance / _day);
var hours = Math.floor((distance % _day) / _hour);
var minutes = Math.floor((distance % _hour) / _minute);
var seconds = Math.floor((distance % _minute) / _second);
document.getElementById(id).innerHTML = days + '일 ';
document.getElementById(id).innerHTML += hours + '시간 ';
document.getElementById(id).innerHTML += minutes + '분 ';
document.getElementById(id).innerHTML += seconds + '초';
}
timer = setInterval(showRemaining, 1000);
}
</script>
[/code]
Html
[code]
<!-- 카운트 출력 (실시간) -->
<span id="countdown"></span>
[/code]
예시화면 첨부합니다.
지정한 날짜/시간/분/초 까지 남은시간을 실시간 카운트 해줍니다.
남은시간이 없는 경우 종료문구 포함되어 있습니다.
경매 등에 사용하면 좋을것 같습니다~
Script
[code]
<script>
CountDownTimer('12/20/2019 00:00', 'countdown');
//시간 지정시
//CountDownTimer('01/01/2020', 'countdown');
//시간 필요없는 경우 대체
function CountDownTimer(dt, id)
{
var end = new Date(dt);
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;
function showRemaining() {
var now = new Date();
var distance = end - now;
if (distance < 0) {
clearInterval(timer);
document.getElementById(id).innerHTML = '경매종료'; // 종료시 보일 문구
return;
}
var days = Math.floor(distance / _day);
var hours = Math.floor((distance % _day) / _hour);
var minutes = Math.floor((distance % _hour) / _minute);
var seconds = Math.floor((distance % _minute) / _second);
document.getElementById(id).innerHTML = days + '일 ';
document.getElementById(id).innerHTML += hours + '시간 ';
document.getElementById(id).innerHTML += minutes + '분 ';
document.getElementById(id).innerHTML += seconds + '초';
}
timer = setInterval(showRemaining, 1000);
}
</script>
[/code]
Html
[code]
<!-- 카운트 출력 (실시간) -->
<span id="countdown"></span>
[/code]
예시화면 첨부합니다.
댓글 10개
loderunner
6년 전
감사합니다~
6년 전
감사합니다~
coDribble
5년 전
오... 이걸 왜 이제 봤을까요..?? 아직 활용할만한 곳은 없지만 유용하게 쓰일 것 같네요!!
공유 감사드립니다~!
공유 감사드립니다~!
5년 전
^^ 꼭 활용하시길! 감사합니다~
5년 전
감사요
2년 전
@블레스 ^^
2년 전
시간이 지나면 해당 상품을 구매할 수 없는 지요?
2년 전
@풍운 말씀주신 부분은 프로그램 하셔야 합니다~
올려드린거는 시간 부분 스크립트 입니다~
올려드린거는 시간 부분 스크립트 입니다~
2년 전
@펄스나인 아 그렇군요...감사합니다
2년 전
@풍운 ^^
게시판 목록
영카트5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 41 | 11년 전 | 9170 | ||
| 40 | 11년 전 | 3403 | ||
| 39 | 11년 전 | 8908 | ||
| 38 | 11년 전 | 13311 | ||
| 37 | 11년 전 | 4757 | ||
| 36 | 11년 전 | 6877 | ||
| 35 | 11년 전 | 7037 | ||
| 34 | 11년 전 | 9897 | ||
| 33 |
restime
|
11년 전 | 8252 | |
| 32 | 11년 전 | 10303 | ||
| 31 | 11년 전 | 8951 | ||
| 30 |
사악한천사☆
|
11년 전 | 5910 | |
| 29 |
|
11년 전 | 7680 | |
| 28 | 11년 전 | 6994 | ||
| 27 | 11년 전 | 6060 | ||
| 26 | 11년 전 | 13599 | ||
| 25 | 11년 전 | 4861 | ||
| 24 |
sahara
|
11년 전 | 7288 | |
| 23 | 11년 전 | 22876 | ||
| 22 | 11년 전 | 6216 | ||
| 21 | 11년 전 | 8756 | ||
| 20 |
|
11년 전 | 11293 | |
| 19 | 11년 전 | 8887 | ||
| 18 | 11년 전 | 9506 | ||
| 17 | 11년 전 | 8228 | ||
| 16 |
Lemios
|
11년 전 | 7930 | |
| 15 | 11년 전 | 10660 | ||
| 14 | 11년 전 | 7532 | ||
| 13 | 11년 전 | 6134 | ||
| 12 | 11년 전 | 7431 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기