[ AngularJS Example ] 3 countdown clocks > 자유게시판

본문 바로가기
사이트 내 전체검색

자유게시판

[ AngularJS Example ] 3 countdown clocks

페이지 정보

profile_image
작성자 로봇
댓글 0건 조회 95회 작성일 25-03-04 15:31

본문

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Alarm Countdown</title>
    <style>
        .countdown {
            font-size: 24px;
            margin: 10px;
        }
    </style>

    <!-- Moment.js CDN -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

    <!-- Moment Countdown Plugin CDN -->
    <script src="https://cdn.rawgit.com/hilios/jQuery.countdown/2.2.0/dist/jquery.countdown.min.js"></script>

    <!-- jQuery (required for Moment Countdown) -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <div style="color: blue">
        Moment.js 쓰는 것인데, 이상하게 작동 안됨.       
    </div>
    <div>
        <div class="countdown">
            <h2>Alarm 1 (8 AM):</h2>
            <div id="countdown1"></div>
        </div>
        <div class="countdown">
            <h2>Alarm 2 (9 AM):</h2>
            <div id="countdown2"></div>
        </div>
        <div class="countdown">
            <h2>Alarm 3 (10 AM):</h2>
            <div id="countdown3"></div>
        </div>
    </div>

    <script>
        // Set the times for 8 AM, 9 AM, and 10 AM today
        var now = moment();
        var alarm1Time = moment().set({hour: 8, minute: 0, second: 0, millisecond: 0}); // 8:00 AM today
        var alarm2Time = moment().set({hour: 22, minute: 40, second: 0, millisecond: 0}); // 9:00 AM today
        var alarm3Time = moment().set({hour: 23, minute: 0, second: 0, millisecond: 0}); // 10:00 AM today

        // Initialize the countdown for each alarm
        $('#countdown1').countdown(alarm1Time.toDate(), function(event) {
            $(this).html(event.strftime('%H:%M:%S'));
        });

        $('#countdown2').countdown(alarm2Time.toDate(), function(event) {
            $(this).html(event.strftime('%H:%M:%S'));
        });

        $('#countdown3').countdown(alarm3Time.toDate(), function(event) {
            $(this).html(event.strftime('%H:%M:%S'));
        });
    </script>

</body>
</html>
countdown
clocks
countdown
clocks
162,163,164,165
[ AngularJS Example ] 3 countdown clocks
[ jquery Example ] 3 countdown clocks (jquery.countdown.min.js)
[ Vanilla JavaScript Example ] 3 countdown clocks
[ AngularJS Example ] 3 countdown clocks

댓글목록

등록된 댓글이 없습니다.

Total 213건 1 페이지

검색

회원로그인

회원가입
새글

To Do List
  • Test 계정 만들기
  • 다른 회원의 스크랩 보기


사이트 정보

회사명 : 회사명 / 대표 : 대표자명
주소 : OO도 OO시 OO구 OO동 123-45
사업자 등록번호 : 123-45-67890
전화 : 02-123-4567 팩스 : 02-123-4568
통신판매업신고번호 : 제 OO구 - 123호
개인정보관리책임자 : 정보책임자명

접속자집계

오늘
77
어제
402
최대
970
전체
12,503
Copyright © 소유하신 도메인. All rights reserved.