Difference between revisions of "Team:Melbourne"

Line 1: Line 1:
 
{{Melbourne}}
 
{{Melbourne}}
 +
 
<html>
 
<html>
  
−
<head>
+
<script>
−
    <title>
+
// Set the date we're counting down to
−
        Melbourne Team Site Wiki
+
var countDownDate = new Date("Jan 5, 2019 15:37:25").getTime();
−
    </title>
+
  
−
 
+
// Update the count down every 1 second
−
</head>
+
var x = setInterval(function() {
  
 +
  // Get todays date and time
 +
  var now = new Date().getTime();
  
−
<body>
+
  // Find the distance between now an the count down date
 +
  var distance = countDownDate - now;
  
−
w
+
  // Time calculations for days, hours, minutes and seconds
−
<br>
+
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
−
w
+
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
−
<br>
+
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
−
w
+
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
−
w
+
−
<br>
+
  
 +
  // Display the result in an element with id="demo"
 +
  document.getElementById("demo").innerHTML = days + "d " + hours + "h "
 +
  + minutes + "m " + seconds + "s ";
  
−
</body>
+
  // If the count down is finished, write some text
 +
  if (distance < 0) {
 +
    clearInterval(x);
 +
    document.getElementById("demo").innerHTML = "EXPIRED";
 +
  }
 +
}, 1000);
 +
</script>
  
 +
<style>
 +
/* Set height to 100% for body and html to enable the background image to cover the whole page: */
 +
body, html {
 +
    height: 100%
 +
}
  
 +
.bgimg {
 +
    /* Background image */
 +
    background-image: url('/w3images/forestbridge.jpg');
 +
    /* Full-screen */
 +
    height: 100%;
 +
    /* Center the background image */
 +
    background-position: center;
 +
    /* Scale and zoom in the image */
 +
    background-size: cover;
 +
    /* Add position: relative to enable absolutely positioned elements inside the image (place text) */
 +
    position: relative;
 +
    /* Add a white text color to all elements inside the .bgimg container */
 +
    color: white;
 +
    /* Add a font */
 +
    font-family: "Courier New", Courier, monospace;
 +
    /* Set the font-size to 25 pixels */
 +
    font-size: 25px;
 +
}
  
 +
/* Position text in the top-left corner */
 +
.topleft {
 +
    position: absolute;
 +
    top: 0;
 +
    left: 16px;
 +
}
  
 +
/* Position text in the bottom-left corner */
 +
.bottomleft {
 +
    position: absolute;
 +
    bottom: 0;
 +
    left: 16px;
 +
}
 +
 +
/* Position text in the middle */
 +
.middle {
 +
    position: absolute;
 +
    top: 50%;
 +
    left: 50%;
 +
    transform: translate(-50%, -50%);
 +
    text-align: center;
 +
}
 +
 +
/* Style the <hr> element */
 +
hr {
 +
    margin: auto;
 +
    width: 40%;
 +
}
 +
</style>
 +
 +
 +
<body>
 +
<div class="bgimg">
 +
  <div class="topleft">
 +
    <p>Logo</p>
 +
  </div>
 +
  <div class="middle">
 +
    <h1>COMING SOON</h1>
 +
    <hr>
 +
    <p>35 days</p>
 +
  </div>
 +
  <div class="bottomleft">
 +
    <p>Some text</p>
 +
  </div>
 +
</div>
 +
</body>
  
  
 
</html>
 
</html>

Revision as of 15:28, 6 October 2018

Logo

COMING SOON

35 days

Some text