[JavaScript] D-Day 타이머

D-Day 타이머

var ddaytimer = setInterval (dayGap, 1000)
function dayGap () {
    var dday = new Date("November 24, 2017 00:00:00").getTime();// 디데이
    var nowday = new Date();// 현재시각
    nowday = nowday.getTime();// 밀리세컨드 단위변환
    var distance = dday - nowday;// 남은 시간에서 현재시작을 뺀다.

    var d = Math.floor(distance / (1000 * 60 * 60 * 24));// 일

    var h = Math.floor((distance / (1000*60*60)) % 24);// 시간
    var m = Math.floor((distance / (1000*60)) % 60);// 분
    var s = Math.floor((distance / 1000) % 60);// 초

    if (distance <= 0) {// 날짜가 바뀌는 기준으로 D-day로 변경
        document.getElementById("dday-timer").innerHTML = "D-day";
    } else {
        document.getElementById("time-day").innerHTML = d;
        document.getElementById("time-hour").innerHTML = h;
        document.getElementById("time-minute").innerHTML = m;
        document.getElementById("time-second").innerHTML = s;
    }
}

HTML으로 뼈대를 만든 후, 스타일시트를 활용해서 간단하게 숫자를 디자인하고, 그 위에 자바스크립트로 기능을 구현할 것, 메인 랜딩페이지 또는 서비스 오픈 디데이 페이지를 만들 수 있다.