메뉴 건너뛰기

조회 수 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. jquery timer, javascript countdown (타이머 예제)

    Date2018.11.07 Views81491
    Read More
  2. jquery selector / jquery 선택자 / 자주 사용하는 jquery selector 선택자 / selecter

    Date2016.09.09 Views8149
    Read More
  3. jQuery Selector (셀렉터)

    Date2016.11.18 Views6931
    Read More
  4. jQuery selectBox 컨트롤.

    Date2018.07.25 Views2558
    Read More
  5. jquery radio checked (라디오 버튼 값으로 선택), 검색 조건 초기 셋팅

    Date2016.11.17 Views10046
    Read More
  6. jQuery Quick API

    Date2016.09.13 Views6934
    Read More
  7. jQuery Plugin : Slider

    Date2019.01.10 Views1113
    Read More
  8. jquery function 생성

    Date2016.09.11 Views6963
    Read More
  9. jquery enter key event submit (jquery 엔터키 이벤트)

    Date2016.11.17 Views6857
    Read More
  10. jQuery datepicker 팝업창 사이즈 바꾸기

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

    Date2017.07.05 Views5806
    Read More
  12. jQuery Cookie

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

    Date2021.03.09 Views580
    Read More
  14. jQuery - 드래그앤드롭(DragAndDrop)을 통한 파일 업로드

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

    Date2021.03.09 Views363
    Read More
  16. jquery - select option 선택값 가져오기

    Date2018.09.06 Views5330
    Read More
  17. jQuery - radio, checkBox값 가져오기, 선택하기, 제어 등

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

    Date2021.03.09 Views613
    Read More
  19. jQuery - ajaxSubmit 사용법 및 유의사항(페이지 리로드 현상)

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

    Date2021.03.09 Views586
    Read More
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved