jQuery | 카운트다운 디지털 시계
페이지 정보
작성자 100K5 작성일18-04-25 09:24 조회29,817회 댓글0건관련링크
본문
<script>
/*
* Basic Count Down to Date and Time
* Author: @mrwigster / trulycode.com
*/
(function (e) {
e.fn.countdown = function (t, n) {
function i() {
eventDate = Date.parse(r.date) / 1e3;
currentDate = Math.floor(e.now() / 1e3);
if (eventDate <= currentDate) {
n.call(this);
clearInterval(interval)
}
seconds = eventDate - currentDate;
days = Math.floor(seconds / 86400);
seconds -= days * 60 * 60 * 24;
hours = Math.floor(seconds / 3600);
seconds -= hours * 60 * 60;
minutes = Math.floor(seconds / 60);
seconds -= minutes * 60;
days == 1 ? thisEl.find(".timeRefDays").text(":") : thisEl.find(".timeRefDays").text(":");
hours == 1 ? thisEl.find(".timeRefHours").text(":") : thisEl.find(".timeRefHours").text(":");
minutes == 1 ? thisEl.find(".timeRefMinutes").text(":") : thisEl.find(".timeRefMinutes").text(":");
// seconds == 1 ? thisEl.find(".timeRefSeconds").text(":") : thisEl.find(".timeRefSeconds").text("");
if (r["format"] == "on") {
days = String(days).length >= 2 ? days : "0" + days;
days1 = String(days).substr(0,1);
days2 = String(days).substr(1,1);
hours = String(hours).length >= 2 ? hours : "0" + hours;
minutes = String(minutes).length >= 2 ? minutes : "0" + minutes;
seconds = String(seconds).length >= 2 ? seconds : "0" + seconds
}
if (!isNaN(eventDate)) {
thisEl.find(".days").text(days);
thisEl.find(".days_1").text(String(days).substr(0,1));
thisEl.find(".days_2").text(String(days).substr(1,1));
thisEl.find(".hours").text(hours);
thisEl.find(".hours_1").text(String(hours).substr(0,1));
thisEl.find(".hours_2").text(String(hours).substr(1,1));
thisEl.find(".minutes").text(minutes);
thisEl.find(".minutes_1").text(String(minutes).substr(0,1));
thisEl.find(".minutes_2").text(String(minutes).substr(1,1));
thisEl.find(".seconds").text(seconds)
thisEl.find(".seconds_1").text(String(seconds).substr(0,1));
thisEl.find(".seconds_2").text(String(seconds).substr(1,1));
} else {
alert("Invalid date. Example: 30 June 2018 18:00:00");
clearInterval(interval)
}
}
var thisEl = e(this);
var r = {
date: null,
format: null
};
t && e.extend(r, t);
i();
interval = setInterval(i, 1e3)
}
})(jQuery);
$(document).ready(function () {
function e() {
var e = new Date;
e.setDate(e.getDate() + 60);
dd = e.getDate();
mm = e.getMonth() + 1;
y = e.getFullYear();
futureFormattedDate = mm + "/" + dd + "/" + y;
return futureFormattedDate
}
$("#countdown").countdown({
date: "30 June 2018 18:00:00", // Change this to your desired date to countdown to
format: "on"
});
});
</script>
<div class="deadline">
<div class="deadline_inner">
<div class="dead_top">
<div class="dea_tit">
<p>Deadline<strong> - June 30, 2018</strong></p>
</div>
<ul class="clock_info">
<li>DAYS</li>
<li>HOURS</li>
<li>MINUTES</li>
<li>SECONDS</li>
</ul>
<div id="countdown">
<div>
<span class="days_1">0</span>
<span class="days_2">0</span>
</div>
<div>
<span class="hours_1">00</span>
<span class="hours_2">00</span>
</div>
<div>
<span class="minutes_1">00</span>
<span class="minutes_2">00</span>
</div>
<div>
<span class="seconds_1">00</span>
<span class="seconds_2">00</span>
</div>
</div>
</div>
</div>
댓글목록
등록된 댓글이 없습니다.