타이머 강좌 보면서 작성해 봤는데... 왜 작동을 안하죠??
본문
제가 타임아웃 기능을 만들려고 이곳저곳 보면서 어찌어찌 만들었는데....
시간이 안흘러요..... 왜 이런거죠???
분명 강좌나 인터넷 블로그 다 보면 틀린 부분이 없는것 같은데.......
자바스크립트가 문제 인것 같은데 뭐가 문제인지를 모르겠어요...
혹시 데이터베이스와 연동을 안해서 그런가요???
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=375, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
</head>
<body>
<style>
.timeout {
position: fixed;
z-index: 10000;
top: 0;
left: 0;
background-color:black;
width: 375px;
height: 52px;
background-position: center;
background-size: contain;
}
.timeout-time {
font-size: 18.5px;
position: absolute;
top: 10.5px;
text-align: center;
letter-spacing: 12.5px;
color: #FFFFFF;
}
.time-1 {
left: 158px;
}
.time-2 {
left: 209.5px;
}
.time-3 {
left: 261.5px;
}
</style>
<div class="timeout">
<div class="timeout-time time-1" id="time-1">
00
</div>
<div class="timeout-time time-2" id="time-2">
00
</div>
<div class="timeout-time time-3" id="time-3">
00
</div>
<script>
(function () {
var count_down_counter_hour = $('#time-1');
var count_down_counter_minute = $('#time-2');
var count_down_counter_second = $('#time-3');
var update = function updateCountDownCounterDraw() {
var count_down_now_date = new Date();
var count_down_remain_hour = 23 - count_down_now_date.getHours();
var count_down_remain_minute = 59 - count_down_now_date.getMinutes();
var count_down_remain_second = 59 - count_down_now_date.getSeconds();
count_down_counter_hour.text((count_down_remain_hour < 10 ? '0' : '') + count_down_remain_hour);
count_down_counter_minute.text((count_down_remain_minute < 10 ? '0' : '') + count_down_remain_minute);
count_down_counter_second.text((count_down_remain_second < 10 ? '0' : '') + count_down_remain_second);
}
update();
setInterval(update, 1000);
})();
</script>
</div>
</body>
</html>
