0% found this document useful (0 votes)
15 views2 pages

First Shement Fo Ruu

This HTML document presents a 'Coming Soon' webpage with a countdown timer to December 31, 2025. It features a simple design with a message indicating that the website is being prepared and encourages visitors to stay tuned. The countdown updates every second and displays days, hours, minutes, and seconds until the specified date.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
15 views2 pages

First Shement Fo Ruu

This HTML document presents a 'Coming Soon' webpage with a countdown timer to December 31, 2025. It features a simple design with a message indicating that the website is being prepared and encourages visitors to stay tuned. The countdown updates every second and displays days, hours, minutes, and seconds until the specified date.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Coming Soon</title>
<style>
/* Basic CSS for the page */
body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
margin: 0;
background-color: #f0f0f0;
text-align: center;
}
.container {
padding: 2rem;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
h1 {
color: #333;
font-size: 2.5rem;
margin-bottom: 1rem;
}
p {
color: #666;
font-size: 1.2rem;
margin-bottom: 2rem;
}
.countdown {
display: flex;
justify-content: center;
gap: 1.5rem;
}
.countdown div {
padding: 1rem;
background-color: #007BFF;
color: #fff;
border-radius: 8px;
font-size: 2rem;
min-width: 100px;
display: flex;
flex-direction: column;
align-items: center;
}
.countdown span {
font-size: 0.8rem;
margin-top: 0.5rem;
text-transform: uppercase;
}
</style>
</head>
<body>
<div class="container">
<h1>Our Website is Coming Soon! 🚀</h1>
<p>We're working hard to get this page ready. Stay tuned!</p>
<div class="countdown" id="countdown">
<div>
<span id="days"></span>
<span>Days</span>
</div>
<div>
<span id="hours"></span>
<span>Hours</span>
</div>
<div>
<span id="minutes"></span>
<span>Minutes</span>
</div>
<div>
<span id="seconds"></span>
<span>Seconds</span>
</div>
</div>
</div>

<script>
// Set the date we're counting down to (e.g., December 31, 2025)
const countDownDate = new Date("Dec 31, 2025 23:59:59").getTime();

// Update the countdown every 1 second


const x = setInterval(function() {

// Get today's date and time


const now = new Date().getTime();

// Find the distance between now and the count down date
const distance = countDownDate - now;

// Time calculations for days, hours, minutes and seconds


const days = Math.floor(distance / (1000 * 60 * 60 * 24));
const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 *
60));
const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((distance % (1000 * 60)) / 1000);

// Display the result in the corresponding elements


document.getElementById("days").innerHTML = days;
document.getElementById("hours").innerHTML = hours;
document.getElementById("minutes").innerHTML = minutes;
document.getElementById("seconds").innerHTML = seconds;

// If the countdown is finished, write some text


if (distance < 0) {
clearInterval(x);
document.getElementById("countdown").innerHTML = "We're live! 🎉";
}
}, 1000);
</script>

</body>
</html>

You might also like