"Hành trình vạn dặm bắt đầu từ những bước đi đầu tiên"

せんりのみちもいっぽから

DANH NGÔN

Hành trình vạn dặm bắt đầu từ một bước chân - Lão Tử
Showing posts with label code. Show all posts
Showing posts with label code. Show all posts

Feb 2, 2025

Code đếm ngược đến các ngày lễ trong năm của Việt Nam

<style type="text/css">
.times {text-transform: none; font-size: 14px; padding-right: NONE;}
#times-countdown {
    background: rgba(255,255,255,0);
    color: white;
    font-family: Oswald, Arial, Sans-serif;
    font-size: 165%;
    text-transform: uppercase;
    text-align: center;
    font-weight: normal;
    padding: 0 0 20px 0;
    border-radius: 0px;
}
#demthoigian {
    max-width: 100%;
    margin: 2px auto;
    text-align: center;
}
span#countdown {
    margin: 5px;
    border-radius: 9px;
    padding: 10px;
    text-align: center;
    background-color: none;
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcXkuNZ_TYhHnJ13oTnZUssO2i5kigW5kKTMSmDfOHVYbpOLWJSjQP3W-6adrb0of32DBNKHlVHBQ2VtWoGO8xlrUop_Xle8HicsdU_J8mAnbnUfUpelO32Kj7VHZXdVBZaqxgWPZWHQAmjNG0nmri2gVuaDonndJEHxy2eGSBzh9vMsNhNpT5Y_RmbY0/s1600/ggk.jpg");
    background-size: 200px 40px;
    background-repeat: no-repeat;
    color: #6633CC;
    font-size: 100%;
    font-weight: 300;
    font-family: 'Nove Cento';
}
#times-countdown h2 {
    font-size: 20px;
    color: #034688;
    font-weight: 300;
    text-align: center;
    padding: 6px;
    margin: 15px;
}
</style>

<div id='times-countdown'>
    <h2 id="holiday-name"></h2>
    <div id='demthoigian'>
        <span id='countdown'></span>
    </div>
</div>

<script type='text/javascript'>
(function() {
    var holidays = [
        { date: '01-01', name: 'Tết Dương Lịch' },
        { date: '01-29', name: 'Tết Nguyên Đán' }, // Tết 2025 (cập nhật mỗi năm)
        { date: '04-08', name: 'Giỗ Tổ Hùng Vương' }, // 10/3 ÂL 2025 (cập nhật mỗi năm)
        { date: '04-30', name: 'Ngày Giải phóng miền Nam' },
        { date: '05-01', name: 'Ngày Quốc tế Lao động' },
        { date: '09-02', name: 'Ngày Quốc khánh' },
        { date: '11-20', name: 'Ngày Nhà giáo Việt Nam' }
    ];

    var today = new Date();
    var currentYear = today.getFullYear();
    var closestHoliday = null;
    var targetDate = null;
    var minDaysLeft = Infinity;

    holidays.forEach(function(holiday) {
        var holidayDate = new Date(currentYear, parseInt(holiday.date.split('-')[0]) - 1, parseInt(holiday.date.split('-')[1]));

        // Nếu ngày lễ đã qua, chuyển sang năm tiếp theo
        if (holidayDate < today) {
            holidayDate.setFullYear(currentYear + 1);
        }

        var daysLeft = Math.ceil((holidayDate - today) / (1000 * 60 * 60 * 24));

        if (daysLeft < minDaysLeft) {
            minDaysLeft = daysLeft;
            closestHoliday = holiday;
            targetDate = holidayDate;
        }
    });

    if (closestHoliday) {
        document.getElementById("holiday-name").innerHTML = "Đếm ngược đến " + closestHoliday.name;

        function updateCountdown() {
            var currentDate = new Date().getTime();
            var secondsLeft = (targetDate.getTime() - currentDate) / 1000;

            var days = parseInt(secondsLeft / 86400);
            secondsLeft = secondsLeft % 86400;

            var hours = parseInt(secondsLeft / 3600);
            secondsLeft = secondsLeft % 3600;

            var minutes = parseInt(secondsLeft / 60);
            var seconds = parseInt(secondsLeft % 60);

            document.getElementById("countdown").innerHTML = days + " <span class='times'>ngày</span> " + 
                hours + " <span class='times'>giờ</span> " + 
                minutes + " <span class='times'>phút</span> " + 
                seconds + " <span class='times'>giây</span>";
        }

        setInterval(updateCountdown, 1000);
        updateCountdown();
    }
})();
</script>

Code đếm ngược có hình nền

<style type="text/css">
.times{text-transform:none;font-size:14px;padding-right:NONE}
#times-countdown{background:rgba(255,255,255,0);color:white;font-family:Oswald,Arial,Sans-serif;font-size:165%;text-transform:uppercase;text-align:left;font-weight:normal;padding:0 0 20px 0;border-radius:0px}
#demthoigian{max-width:100%;margin:2px auto;text-align:center}
span#countdown{margin:5px;border-radius:9px;padding:10px;text-align:center;background-color:none;background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcXkuNZ_TYhHnJ13oTnZUssO2i5kigW5kKTMSmDfOHVYbpOLWJSjQP3W-6adrb0of32DBNKHlVHBQ2VtWoGO8xlrUop_Xle8HicsdU_J8mAnbnUfUpelO32Kj7VHZXdVBZaqxgWPZWHQAmjNG0nmri2gVuaDonndJEHxy2eGSBzh9vMsNhNpT5Y_RmbY0/s1600/ggk.jpg");background-size:200px 40px;background-repeat:no-repeat;color:#6633CC;font-size:100%;font-weight:300;font-family:'Nove Cento'}
#times-countdown h2{font-size:20px;color:#034688;font-weight:300;text-align:center;padding:6;margin:15px}
</style>
 <div id='times-countdown'>
     <div id='demthoigian'>
   <span id='countdown'/>
  </span></div>
</div>
<script type='text/javascript'>
//<![CDATA[
// đặt ngày để bắt đầu đếm ngược, ở đây là 01-1-2025
var target_date = new Date("jan 29, 2025").getTime();

// thêm biến cho các đơn vị thời gian
var days, hours, minutes, seconds;

//đặt id là countdown
var countdown = document.getElementById("countdown");

// cập nhật id "countdown" mỗi 1 giây
setInterval(function () {

    // thiết lập cho ngày giờ hiện tại và ngày kết thúc
    var current_date = new Date().getTime();
    var seconds_left = (target_date - current_date) / 1000;

    // tính ngày, giờ, phút và giây
    days = parseInt(seconds_left / 86400);
    seconds_left = seconds_left % 86400;
   
    hours = parseInt(seconds_left / 3600);
    seconds_left = seconds_left % 3600;
   
    minutes = parseInt(seconds_left / 60);
    seconds = parseInt(seconds_left % 60);
   
    // thiết lập cho biến countdown hiển thị ra ngoài
countdown.innerHTML = days + " <span class=\'times\'>ngày</span> " + hours + " <span class=\'times\'>giờ</span> "
  + minutes + " <span class=\'times\'>phút</span> " + seconds + " <span class=\'times\'>giây</span>";

}, 1000);
//]]>
</script>

Nov 9, 2023

Code đếm ngược

 <style type="text/css">

.times{text-transform:none;font-size:14px;padding-right:NONE}

#times-countdown{background:rgba(255,255,255,0);color:white;font-family:Oswald,Arial,Sans-serif;font-size:165%;text-transform:uppercase;text-align:left;font-weight:normal;padding:0 0 20px 0;border-radius:0px}

#demthoigian{max-width:100%;margin:2px auto;text-align:center}

span#countdown{margin:5px;border-radius:9px;padding:10px;text-align:center;background-color:none;background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZnSXaedmDoTdFLU7jHbYOgnqe1Vf5I4tvpMTdNVJwZCrksu3oZuv0eE-WMxlJCH7ZWr0o0gOggpY3LJ6ZKSSLJXww2LngetGsjtEF3ob5vDgwQnppIJGWoXaQbEhE5SAuGuIreqhnrQQc39sZwN4FpMkRpHLprN6aYuBpg8D7yDHK1pjDqVcpLL9Rvmw/s320/86f720320b77bb62311f0a4811db04fe.jpg");background-size:160px 50px;background-repeat:no-repeat;color:#6633CC;font-size:100%;font-weight:300;font-family:'Nove Cento'}

#times-countdown h2{font-size:20px;color:#034688;font-weight:300;text-align:center;padding:6;margin:15px}

</style>

 <div id='times-countdown'>

<h2>Certificate</h2>

     <div id='demthoigian'>

   <span id='countdown'/>

  </span></div>

</div>

<script type='text/javascript'>

//<![CDATA[

// đặt ngày để bắt đầu đếm ngược, ở đây là 04-12-2023

var target_date = new Date("july 7, 2024").getTime();


// thêm biến cho các đơn vị thời gian

var days, hours, minutes, seconds;


//đặt id là countdown

var countdown = document.getElementById("countdown");


// cập nhật id "countdown" mỗi 1 giây

setInterval(function () {


    // thiết lập cho ngày giờ hiện tại và ngày kết thúc

    var current_date = new Date().getTime();

    var seconds_left = (target_date - current_date) / 1000;


    // tính ngày, giờ, phút và giây

    days = parseInt(seconds_left / 86400);

    seconds_left = seconds_left % 86400;

   

    hours = parseInt(seconds_left / 3600);

    seconds_left = seconds_left % 3600;

   

    minutes = parseInt(seconds_left / 60);

    seconds = parseInt(seconds_left % 60);

   

    // thiết lập cho biến countdown hiển thị ra ngoài

countdown.innerHTML = days + " <span class=\'times\'>ngày</span> " + hours + " <span class=\'times\'>giờ</span> "

  + minutes + " <span class=\'times\'>phút</span> " + seconds + " <span class=\'times\'>giây</span>";


}, 1000);

//]]>

</script>

Kết nối bạn bè

Wikipedia

Search results

Video Nổi bật

Cảm ơn các bạn đã ghé thăm

 
Please Enable Javascript!Enable JavaScript