메뉴 건너뛰기

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 document.getElementById() 처럼 DOM 객체 얻기 2016.09.21 6810
58 jquery enter key event submit (jquery 엔터키 이벤트) 2016.11.17 6857
57 jQuery Cookie 2016.09.21 6864
56 항상 레이어가 정 가운데 위치하는 스크립트 2016.12.22 6908
55 jQuery Selector (셀렉터) 2016.11.18 6931
54 jQuery Quick API file 2016.09.13 6934
53 jQuery, JavaScript 새로고침(reload) 2016.11.17 6951
52 jquery function 생성 2016.09.11 6963
» 시간 카운트 2016.12.22 7108
50 이미지 클릭 손 (cursor:pointer) 2016.11.18 7118
49 html 테이블 고정 (table fixed) 2016.11.18 7118
48 getScript() 2016.09.21 7125
47 벨리데이션 체크 / validator / 자동 입력 제한 2016.09.09 7142
46 화면 이동시에 레이어가 따라다니게 하기 2016.09.21 7143
45 jquery 라디오버튼 선택 확인, 체크박스 선택 확인, 셀렉트박스 선택 확인 2016.11.17 7149
44 [jQuery Plugin] FCKeditor 2.6.5 사용법 2016.09.11 7179
43 zeroclipboard - 클립보드 복사하기(자바스크립트 클립보드 복사하기) 2016.10.06 7181
42 간단한 세로 메뉴 file 2016.09.21 7306
41 날짜 검색 범위 정하기 (jquery) file 2016.11.17 7320
40 예제로 만나보는 제이쿼리 - 비동기 파일업로드 file 2017.03.06 7344
Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved