Wednesday 30 May 2018

Count down using jquery Days, hour, min, sec.


<!DOCTYPE html>
<html>
<style>
    body, html
    {
        height: 100%;
        margin: 0 auto;
        padding: 0px;
        color: #333;
    }
   
    .bgimg
    {
        min-height: 100%;
        background-position: center;
        background-size: cover;
        position: relative;
        color: #333;
        font-family: "Courier New" , Courier, monospace;
        font-size: 25px;
    }
   
    .topleft
    {
        position: absolute;
        top: 0;
        left: 16px;
    }
   
    .bottomleft
    {
        position: absolute;
        bottom: 0;
        left: 16px;
    }
   
    .middle
    {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }
</style>
<body>
    <div class="bgimg">
        <div style="width: 100%;">
            <div style="width: 100%; height: 60px; background-color: #D6BE94;">
                <div style="width: 100%; height: 65px; background-color: #D6BE94; background-image: url('images/logo1.png');
                    background-repeat: no-repeat;">
                </div>
            </div>
        </div>
        <div class="divround" style="width: 100%; float: right; height: 27px; background-color: #4F8C68;
            margin: 0px 0px 0 0;" align="right">
        </div>
        <div class="middle">
            <h1>
                Site under maintenance</h1>
            <hr style="margin: auto; width: 40%" />
            <p id="cntDown" style="font-weigth: bold; font-size: 30px">
            </p>
        </div>
      <!--  <div class="bottomleft">
            <p>
                We are under maintenance....</p>
        </div>-->
    </div>
    <script>
        // Set the date we're counting down to
        var countDownDate = new Date("May 30, 2018 15:37:25").getTime();

        // Update the count down every 1 second
        var countdownfunction = setInterval(function () {

            // Get todays date and time
            var now = new Date().getTime();

            // Find the distance between now an the count down date
            var distance = countDownDate - now;

            // Time calculations for days, hours, minutes and seconds
            var days = Math.floor(distance / (1000 * 60 * 60 * 24));
            var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((distance % (1000 * 60)) / 1000);

            // Output the result in an element with id="demo"
            document.getElementById("cntDown").innerHTML = days + " Days : " + hours + " Hour :"
    + minutes + " Min. : " + seconds + " Sec. ";

            // If the count down is over, write some text
            if (distance < 0) {
                clearInterval(countdownfunction);
                document.getElementById("cntDown").innerHTML = "EXPIRED";
            }
        }, 10);
    </script>
</body>
</html>



No comments:

Post a Comment

Excel Sort values in ascending order using function TEXTJOIN

 Excel ::  Text ::  1,3,5,2,9,5,11 Result :: 1,2,3,5,5,9,11 Formula ::     TEXTJOIN ( ",",1,SORT(MID(SUBSTITUTE( A1 ,","...