테스트 사이트 - 개발 중인 베타 버전입니다

디데이 남은날자 자동구하기중 종료에 관하여 채택완료

망이망소이 4년 전 조회 2,067

D-day 까지 남아 있는 날짜를 구하는 소스인데요

 

아래소스는 디데이시점을 오늘 00시로했습니다. 

결과:

-1day-19시-4분0-47초 남았습니다.

</p>

<p><div class="content"></div>

    <div class="progress-bar-con">

        <div class="progress-bar"></div>

    </div></p>

<p><script>

    //D-Day 남은 날짜 자동으로 구하기

(function(){

    var widthbar = $('.progress-bar').width();</p>

<p>    var counter = function(){

        var startDate = new Date("2021/04/21 00:00:00") //디데이 (날짜 설정)

            setInterval(function(){

                var currentDate = new Date(); //현재 날짜 가져오기

                var distance = startDate.getTime() - currentDate.getTime();

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

                var h = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));

                var m = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));

                var s = Math.floor((distance % (1000 * 60)) / 1000);</p>

<p>                if(s < 10){ s = '0'+s;}

                $('.content').html(d+'day'+ h +'시'+ m +'분'+ s+'초 남았습니다.' )</p>

<p>                $('.progress-bar').css({

                    width: d * (widthbar / 31) +'px' //여기서 31은 1일부터 ~ 31일까지 기준이다.

                })

        }, 1000);

    }

    counter();

})();

    </script></p>

<p>

 

 

아래소스는 디데이시점을 내일 00시로했습니다.

결과:

0day5시51분05초 남았습니다.

</p>

<p><div class="content"></div>

    <div class="progress-bar-con">

        <div class="progress-bar"></div>

    </div></p>

<p>    <script>

    //D-Day 남은 날짜 자동으로 구하기

(function(){

    var widthbar = $('.progress-bar').width();</p>

<p>    var counter = function(){

        var startDate = new Date("2021/04/22 00:00:00") //디데이 (날짜 설정)

            setInterval(function(){

                var currentDate = new Date(); //현재 날짜 가져오기

                var distance = startDate.getTime() - currentDate.getTime();

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

                var h = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));

                var m = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));

                var s = Math.floor((distance % (1000 * 60)) / 1000);</p>

<p>                if(s < 10){ s = '0'+s;}

                $('.content').html(d+'day'+ h +'시'+ m +'분'+ s+'초 남았습니다.' )</p>

<p>                $('.progress-bar').css({

                    width: d * (widthbar / 31) +'px' //여기서 31은 1일부터 ~ 31일까지 기준이다.

                })

        }, 1000);

    }

    counter();

})();

    </script></p>

<p>

 

 

하고자 하는것은

 

질문1) D-day가 되면  '0' 또는 '종료'로 출력하고 싶습니다.

질문2) D-day가 지나면 '초'표시가 보시면 좀 이상해지는데 어느부분 문제일까요?

 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

currentDate.getTime(); 과

 

startDate.getTime(); 를 비교해서 동일 수치가 나오면

 

종료로 바꾸면 되지않을까요?

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

망이망소이
4년 전
감사합니다.^^

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인