메뉴 건너뛰기

2016.12.22 20:28

시간 카운트

조회 수 7108 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>




<script language="javascript">




$(document).ready(function(){
 //초기값
 var hour = 12;
 var minute = 00;
 var second = 2;
 
 // 초기화
 $(".countTimeHour").html(hour);
 $(".countTimeMinute").html(minute);
 $(".countTimeSecond").html(second);
 
 var timer = setInterval(function () {
  // 설정
  $(".countTimeHour").html(hour);
  $(".countTimeMinute").html(minute);
  $(".countTimeSecond").html(second);
  
  if(second == 0 && minute == 0 && hour == 0){
   alert('타이머 종료.');
   clearInterval(timer); /* 타이머 종료 */
  }else{
   second--;
   if(second<10){
    $(".countTimeSecond").html('0' + second);
   }
  
   // 분처리
   if(second == 0){
    minute--;
    second = 59;
   }
   if(minute<10){
    $(".countTimeMinute").html('0' + minute);
   }
   
   //시간처리
   if(minute == 0){
    if(hour > 0){
     hour--;
     minute = 59;
    }    
   }
   if(hour<10){
    $(".countTimeHour").html('0' + hour);
   }
  }
 }, 1000); /* millisecond 단위의 인터벌 */
});




</script>

</head>

<body>

 <div>

  <strong>시간 카운트</strong>

  <span class="countTimeHour">60</span>시

  <span class="countTimeMinute">60</span>분

  <span class="countTimeSecond">60</span>초

 </div>

</body>

</html>

List of Articles
번호 제목 날짜 조회 수
59 jQuery 기초 ((문자열 추가 .before / .after) (문자열 삭제 .remove / .empty) file 2019.01.16 1084
58 jQuery 기초 (Query link url / download (위치, 사용법) // p태그, id, class 접근 / 일반태그 가져오기 / 클릭시 값) 2019.01.16 1079
57 jQuery 기초 (JQuery - text(), val(), html(), attr(), prop()) 2019.01.16 1055
56 jQuery 로 원하는 갯수만큼 checkbox 선택하기 2019.01.10 1022
55 .removeAttr() : 특정 속성을 제거 2019.01.16 1021
54 이미지 확대/축소 2020.11.25 972
53 .attr() : 태그의 속성 값을 읽어오거나 속성을 추가및 재설정 2019.01.16 962
52 jQuery 로 탭메뉴 2019.01.10 938
51 텍스트 필드에 기본글이 마우스 클릭하면 지워지게 하기 폼필드 소스 내에 아래 태그를 삽입한다. 2019.06.04 867
50 jQuery 일반적 팁 2019.06.04 853
49 정규식, 한글 못쓰게 하기, replace all 2021.03.26 842
48 click event scroll 2021.03.31 827
47 //ex)텍스트 박스 포커스 활성, 비활성 이벤트 2019.06.04 812
46 DateTimepicker ( Timepicker + Datepicker ) file 2021.03.26 787
45 JS 날짜 자료 비교 2019.06.04 787
44 새창(자식창) 제어하기, 새창 POST방식으로 값 넘기기 2021.03.26 785
43 체크박스 전체선택/해지 2019.06.04 780
42 JS 타이머 샘플 2019.06.04 745
41 간단한 스크롤 따라 움직이는 메뉴 만들기 2021.03.26 725
40 사업자 번호를 입력하면 자동으로 하이픈을 붙여줍니다. 2020.08.24 703
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved