메뉴 건너뛰기

조회 수 81560 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
function dailyMissionTimer(duration) {
    
    var timer = duration * 3600;
    var hours, minutes, seconds;
    
    var interval = setInterval(function(){
        hours	= parseInt(timer / 3600, 10);
        minutes = parseInt(timer / 60 % 60, 10);
        seconds = parseInt(timer % 60, 10);
		
        hours 	= hours < 10 ? "0" + hours : hours;
        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;
		
        $('#time-hour').text(hours);
        $('#time-min').text(minutes);
        $('#time-sec').text(seconds);

        if (--timer < 0) {
            timer = 0;
            clearInterval(interval);
        }
    }, 1000);
}

dailyMissionTimer(24);	// hour base


<span id="time-hour"></span>
<span id="time-min"></span>
<span id="time-sec"></span>


function countdown( elementName, minutes, seconds )
{
    var element, endTime, hours, mins, msLeft, time;

    function twoDigits( n )
    {
        return (n <= 9 ? "0" + n : n);
    }

    function updateTimer()
    {
        msLeft = endTime - (+new Date);
        if ( msLeft < 1000 ) {
            element.innerHTML = "countdown's over!";
        } else {
            time = new Date( msLeft );
            hours = time.getUTCHours();
            mins = time.getUTCMinutes();
            element.innerHTML = (hours ? hours + ':' + twoDigits( mins ) : mins) + ':' + twoDigits( time.getUTCSeconds() );
            setTimeout( updateTimer, time.getUTCMilliseconds() + 500 );
        }
    }

    element = document.getElementById( elementName );
    endTime = (+new Date) + 1000 * (60*minutes + seconds) + 500;
    updateTimer();
}

countdown( "countdown", 1, 5 );
countdown( "countdown2", 100, 0 );

<div id="countdown"></div>
<div id="countdown2"></div>

div {
    color: #1B232F;
    font-family: Verdana, Arial, sans-serif;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
}



List of Articles
번호 제목 날짜 조회 수
139 간단한 스크롤 따라 움직이는 메뉴 만들기 2021.03.26 727
138 JS 타이머 샘플 2019.06.04 746
137 JS 날짜 자료 비교 2019.06.04 788
136 새창(자식창) 제어하기, 새창 POST방식으로 값 넘기기 2021.03.26 788
135 체크박스 전체선택/해지 2019.06.04 790
134 DateTimepicker ( Timepicker + Datepicker ) file 2021.03.26 792
133 //ex)텍스트 박스 포커스 활성, 비활성 이벤트 2019.06.04 812
132 click event scroll 2021.03.31 827
131 정규식, 한글 못쓰게 하기, replace all 2021.03.26 846
130 jQuery 일반적 팁 2019.06.04 853
129 텍스트 필드에 기본글이 마우스 클릭하면 지워지게 하기 폼필드 소스 내에 아래 태그를 삽입한다. 2019.06.04 867
128 jQuery 로 탭메뉴 2019.01.10 939
127 .attr() : 태그의 속성 값을 읽어오거나 속성을 추가및 재설정 2019.01.16 962
126 이미지 확대/축소 2020.11.25 979
125 .removeAttr() : 특정 속성을 제거 2019.01.16 1021
124 jQuery 로 원하는 갯수만큼 checkbox 선택하기 2019.01.10 1031
123 jQuery 기초 (JQuery - text(), val(), html(), attr(), prop()) 2019.01.16 1055
122 jQuery 기초 (Query link url / download (위치, 사용법) // p태그, id, class 접근 / 일반태그 가져오기 / 클릭시 값) 2019.01.16 1079
121 jQuery 로 해보는 체크박스(checkbox) 전체선택, 선택해제 예제 2019.01.10 1085
120 jQuery를 이용한 스크롤 따라니는 배너를 쉽게 맨들기(scroll follow) file 2019.01.10 1093
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved