메뉴 건너뛰기

조회 수 81491 추천 수 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;
}



  1. No Image 07Nov
    by 조쉬
    2018/11/07 Views 81491 

    jquery timer, javascript countdown (타이머 예제)

  2. No Image 09Sep
    by
    2016/09/09 Views 8149 

    jquery selector / jquery 선택자 / 자주 사용하는 jquery selector 선택자 / selecter

  3. No Image 18Nov
    by
    2016/11/18 Views 6931 

    jQuery Selector (셀렉터)

  4. No Image 25Jul
    by
    2018/07/25 Views 2558 

    jQuery selectBox 컨트롤.

  5. No Image 17Nov
    by
    2016/11/17 Views 10046 

    jquery radio checked (라디오 버튼 값으로 선택), 검색 조건 초기 셋팅

  6. jQuery Quick API

  7. jQuery Plugin : Slider

  8. No Image 11Sep
    by
    2016/09/11 Views 6963 

    jquery function 생성

  9. No Image 17Nov
    by
    2016/11/17 Views 6857 

    jquery enter key event submit (jquery 엔터키 이벤트)

  10. jQuery datepicker 팝업창 사이즈 바꾸기

  11. jquery css div, li 리스트 선택한 메뉴 변경 출처: http://okkks.tistory.com/1062 [이건없지]

  12. No Image 21Sep
    by
    2016/09/21 Views 6864 

    jQuery Cookie

  13. jQuery - 클릭이벤트 동적 처리하기($("").click(), on('click') 차이)

  14. jQuery - 드래그앤드롭(DragAndDrop)을 통한 파일 업로드

  15. jQuery - 드래그, 리사이즈 이벤트에 따른 영역 침범 막기

  16. No Image 06Sep
    by
    2018/09/06 Views 5330 

    jquery - select option 선택값 가져오기

  17. jQuery - radio, checkBox값 가져오기, 선택하기, 제어 등

  18. jQuery - checkbox 전체 선택, 해제 기능 및 단일 체크박스가 해제되었을때 전체 선택 해제 하기

  19. No Image 09Mar
    by
    2021/03/09 Views 1470 

    jQuery - ajaxSubmit 사용법 및 유의사항(페이지 리로드 현상)

  20. jQuery - ajax xhr을 활용한 파일 업로드 진행 상태 확인하기

Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved