모바일과 PC버전에서 소스충돌 이유 해결해주실 고수님 찾습니다..

모바일과 PC버전에서 소스충돌 이유 해결해주실 고수님 찾습니다..

QA

모바일과 PC버전에서 소스충돌 이유 해결해주실 고수님 찾습니다..

본문


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Countdown Timer</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
    <style>
        .countdown {
            font-size: 2rem;
            font-weight: bold;
            color: #f87171;
        }
        .icon {
            font-size: 1.5rem;
            color: #ec4899;
            margin: 0 0.5rem;
        }
    </style>
</head>
<body class="flex justify-center items-center h-screen bg-gray-100">
    <div class="flex items-center text-lg">
        <i class="fas fa-alarm-clock icon"></i>
        <span class="font-bold text-gray-800">⏰얼리버드 종료 까지⏰</span>
        <div class="countdown ml-4" id="countdown">Loading...</div>
        <i class="fas fa-alarm-clock icon"></i>
    </div>
    <script>
        function getNextMidnight() {
            const now = new Date();
            const midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1);
            return midnight.getTime();
        }
        // Update the countdown every 1 second
        const x = setInterval(function() {
            const now = new Date().getTime();
            const countDownDate = getNextMidnight();
            const distance = countDownDate - now;
            const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            const seconds = Math.floor((distance % (1000 * 60)) / 1000);
            document.getElementById("countdown").innerHTML = `${hours}시간 ${minutes}분 ${seconds}초`;
            if (distance < 0) {
                clearInterval(x);
                document.getElementById("countdown").innerHTML = "종료되었습니다";
            }
        }, 1000);
    </script>
</body>
</html>

 

PC버전에서는 기능이 구현이 되는데 모바일 버전에서는 소스가 충돌이 되어서 타이머 기능이 작동되지 않습니다 왜 이러는 걸까요?

이 질문에 댓글 쓰기 :

답변 1


function getNextMidnight() {
  const now = new Date();
  const midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 0, 0, 0, 0);
  return midnight.getTime();
}

시도해보세요.

답변을 작성하시기 전에 로그인 해주세요.
전체 121
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT