diff --git a/index.css b/index.css index ec4a909..b53bd65 100644 --- a/index.css +++ b/index.css @@ -2,13 +2,13 @@ body { background-color: #80d4ea; } -#clock { +#datetime { height: 100px; width: 800px; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; - padding-top: 70px; + margin-top: 200px; font-family: courier, monospace; text-align: center; color: white; diff --git a/index.html b/index.html index 191d3cc..c92a582 100644 --- a/index.html +++ b/index.html @@ -7,8 +7,15 @@ +
+
+
+ + - - diff --git a/index.js b/index.js index 877a3aa..c1d52c1 100644 --- a/index.js +++ b/index.js @@ -1 +1,40 @@ -// Your code here +$(document).ready(function() { + + // var addZero = function(digit) { + // if (digit < 10) { + // digit = "0" + digit; + // } + // return digit; + // }; + + var showTime = function() { + var today = new Date(); + var options = { weekday: 'long', year: 'numeric', month: '2-digit', day: '2-digit', hour: "2-digit", minute: "2-digit", second: "numeric" }; + var dateTime = today.toLocaleString('en-US', options); + + // days = addZero(today.getDate()), + // months = addZero(today.getMonth()), + // years = today.getFullYear(), + // hours = today.getHours(), + // minutes = addZero(today.getMinutes()), + // seconds = addZero(today.getSeconds()), + // ampm = hours > 11 ? ' PM' : ' AM', + // americanHours; + // + // if (hours === 0) { + // americanHours = 12; + // } else if (hours < 13) { + // americanHours = hours; + // } else { + // americanHours = addZero(hours % 12); + // } + // + // $("#date").html(months + "/" + days + "/" + years); + // $("#clock").html(americanHours + ":" + minutes + ":" + seconds + ampm); + + $("#clock").html(dateTime); + + }; + + setInterval(showTime, 1000); +});