diff --git a/index.css b/index.css index ec4a909..58d1a7a 100644 --- a/index.css +++ b/index.css @@ -2,15 +2,14 @@ body { background-color: #80d4ea; } -#clock { +div { height: 100px; width: 800px; margin: auto; - position: absolute; - top: 0; left: 0; bottom: 0; right: 0; + padding-top: 70px; font-family: courier, monospace; text-align: center; color: white; - font-size: 100px; + font-size: 70px; } diff --git a/index.html b/index.html index 191d3cc..becef46 100644 --- a/index.html +++ b/index.html @@ -1,14 +1,21 @@ - - Clock Tower - - - + + Clock Tower + + + - -
- - + +
+
+
+
+ + - + + diff --git a/index.js b/index.js index 877a3aa..a433f1a 100644 --- a/index.js +++ b/index.js @@ -1 +1,50 @@ -// Your code here +$(document).ready(function(){ + + var startTime = function(time_difference){ + var today = new Date(); + var year = today.getFullYear(); + var month = today.getMonth() + 1; + var date = today.getDate(); + var h = today.getHours() + time_difference; + if (h >= 24) { + date = date + 1; + h = h - 24; + } + var m = today.getMinutes(); + var s = today.getSeconds(); + h = checkTime(h); + m = checkTime(m); + s = checkTime(s); + return (year + "/" + month + "/" + date + " " + h + ":" + m + ":" + s); + } ; + + var checkTime = function(i) { + if (i < 10) {i = "0" + i}; + return i; + }; + + // var time = startTime() + // $('#clock').append(time); + $('#seoul').append(startTime(16)); + $('#seattle').append(startTime(0)); + $('#new_york').append(startTime(3)); //call the function and append + $('#hongkong').append(startTime(15)); + + var liveClock = function(){ + // var clock = document.getElementById('clock'); + // var clock = $('#clock'); jquery + $('#seoul').html(startTime(16)); + $('#seattle').html(startTime(0)); + $('#new_york').html(startTime(3)); + $('#hongkong').html(startTime(15)); + }; + setInterval(liveClock, 1000); + +}); + + +// +// var checkTime(function(i) { +// if (i < 10) {i = "0" + i}; +// return i; +// });