Share Code Đếm Ngược Ngày Tết Nguyên Đán 2019

Đặng Tiến Sĩ Tác giả:
Xuất bản: Thứ Bảy, 1 tháng 12, 2018 -

Còn 3 tháng nữa là đến TẾT NGUYÊN ĐÁN 2019, Những bạn thích có một cái đồng hồ đếm ngược thời gian về Tết chính xác từng giây thì không khó đâu nhá.


Bạn vào bố cục của Blogger, thêm đoạn mã bên dưới vào trong HTML/JavaScript.

<!-- Countdown holiday -->
<style>
#countdown-holiday{float:left;width:108%;box-sizing:border-box;margin-top:53px}
#timer{padding-top:0}
#timer div{width:70px;height:70px;line-height:36px;z-index:199;background:#ee1b1e;border-radius:50%;text-align:center;font-size:20px;color:#fff;display:inline-block;float:left;text-shadow:0 0.2px 0.3px rgba(0, 0, 0, 0.353);border:5px solid rgba(255, 255, 255, 0.5490196078431373);margin:0 5px}
#timer div:nth-child(1),{margin-left:0}
#timer div:last-child{margin-right:0}
#timer h2{color:#222;}
.title-tet span{font-size:22px!important;font-weight:700;text-transform:uppercase;margin-bottom:20px;font-family:'Utm Avo',sans-serif}
#timer h2 span:before{content:'';display:block;width:10px;height:10px;background:#ee1b1e;position:absolute;bottom:0;left:0;-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);left:calc(50% - 7.5px);bottom:-15px;z-index:3}
#timer h2 span:after{content:'';width:100%;border-bottom:2px solid #222;content:'';display:block;position:absolute;bottom:0;left:0;bottom:-10.5px;z-index:2}
#timer span{margin-bottom:20px;font-size:12px;display:block;transform:translate(0,-38%)}
#days,#hours,#minutes{color:#fb5182}
.title-tet strong{color:#ee1b1e}
@media screen and (max-width: 440px) {
#timer div{width:50px!important;height:50px!important;line-height:26px!important;font-size:15px!important}
#timer span{font-size:8px;transform:translate(0,-52%)!important}
.title-tet span{font-size:18px!important}
}
</style>
<div id='countdown-holiday'>
<div id='timer'>
<h2 class='title-tet'><span>Đếm ngược ngày đến <strong>tết</strong></span></h2>
<div id='days'></div>
<div id='hours'></div>
<div id='minutes'></div>
<div id='seconds'></div>
</div>
</div>
<script type='text/javascript'>
//<![CDATA[
// Countdown holiday
let timeout = null;
function makeTimer() {
// Edit Here
//---- let endTime = new Date("'02/03/2019 23:59:59 GMT+0700 (SE Asia Standard Time)"); ----
let endTime = new Date("'02/05/2019 23:59:59 GMT+0700 (SE Asia Standard Time)");
endTime = (Date.parse(endTime) / 1000);
let now = new Date();
now = (Date.parse(now) / 1000);
let timeLeft = endTime - now,
days = Math.floor(timeLeft / 86400),
hours = Math.floor((timeLeft - (days * 86400)) / 3600),
minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600)) / 60),
seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));
if (hours === 0 && minutes === 0 && seconds === 0) {
clearTimeout(timeout);
} else {
if (hours < "10") {
hours = "0" + hours;
}
if (minutes < "10") {
minutes = "0" + minutes;
}
if (seconds < "10") {
seconds = "0" + seconds;
}
$("#days").html(days + "<span>Ngày</span>");
$("#hours").html(hours + "<span>Giờ</span>");
$("#minutes").html(minutes + "<span>Phút</span>");
$("#seconds").html(seconds + "<span>Giây</span>");
timeout = setTimeout(makeTimer, 1000);
}
}
makeTimer();
//]]>
</script>
<!-- Countdown holiday -->

Nguồn: Tôi Share

Tag:
0 Like
2 Comment More Emoticon

Bài Viết Có Thể Xem

THÔNG BÁO

Biên tập nội dung: Đặng Tiến Sĩ
Sĩ Ben IT Blogger giữ bản quyền nội dung trên website này
Chỉ được phát hành lại nội dung khi có sự đồng ý của chủ sở hữu
Mọi thư từ góp ý vui lòng gửi về địa chỉ dangtiensi.vn@gmail.com

Đóng Liên hệ

Thông báo của Admin