Just a simple countdown Page
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

102 lines
2.9 KiB

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>C3 Counter</title>
<meta name="description" content="An image crossfade animation done with CSS3">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/style2.css">
<link rel="stylesheet" href="css/demo2.css">
<link rel="stylesheet" href="css/font.css">
<script>
var countDownDate = new Date("dec 28, 2019 00:00:01").getTime();
var x = setInterval(function() {
var now = new Date().getTime();
var distance = countDownDate - now;
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
document.getElementById("demo").innerHTML = "there are only " + ("<br>") + days + " days left" + ("<br>") + " until 36C3";
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "It's Congress";
}
}, 1000);
</script>
<style type="text/css">
body {
overflow:hidden;
}
</style>
<script src="src/jquerz.min.js"></script>
<script type="text/javascript">
$(function() {
$('.fadein img:gt(0)').hide();
setInterval(function () {
$('.fadein :first-child').fadeOut(2000)
.next('img')
.fadeIn(2000)
.end()
.appendTo('.fadein');
}, 6000); // 4 seconds
});
</script>
<style>
p {
text-align: center;
font-size: 60px;
margin-top: 0px;
color: #fff;
position: relative;
z-index: 99;
text-transform: uppercase;
font-weight: bold;
font-family: sans-serif;
text-align: left;
padding-top: 25px;
padding-left: 25px;
font-size: 7em;
line-height: 0.8;
font-weight: 900;
font-family: 'c3';
}
</style>
</head>
<body>
<p id="demo"></p>
<div class="fadein" >
<img src="img/01.jpg">
<img src="img/02.jpg">
<img src="img/03.jpg">
<img src="img/04.jpg">
<img src="img/05.jpg">
<img src="img/06.jpg">
<img src="img/07.jpg">
<img src="img/08.jpg">
<img src="img/09.jpg">
<img src="img/10.jpg">
<img src="img/11.jpg">
<img src="img/12.jpg">
<img src="img/13.jpg">
<img src="img/14.jpg">
<img src="img/15.jpg">
<img src="img/16.jpg">
<img src="img/17.jpg">
<img src="img/18.jpg">
<img src="img/19.jpg">
<img src="img/20.jpg">
<img src="img/21.jpg">
<img src="img/22.jpg">
<img src="img/23.jpg">
<img src="img/24.jpg">
<img src="img/25.jpg">
<img src="img/26.jpg">
<img src="img/27.jpg">
<img src="img/28.jpg">
<img src="img/29.jpg">
</div>
</body>
</html>