5. 顏色時鐘副本 | 程式專案

{"id":66545,"student_id":1404,"content":"{\"html\":\"\u003chtml\u003e\\n\u003chead\u003e\\n    \u003ctitle\u003eDocument\u003c/title\u003e\\n    \u003cscript src=\\\"https://code.jquery.com/jquery-3.3.1.min.js\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n\\n    \u003cdiv class=\\\"circle\\\"\u003e\\n        \u003cdiv\u003e\\n            \u003ch1 id=\\\"time\\\"\u003e00:00:00\u003c/h1\u003e\\n            \u003ch2 id=\\\"date\\\"\u003eJan 01, 2000\u003c/h2\u003e\\n        \u003c/div\u003e\\n    \u003c/div\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"/* 1 */\\nbody {\\n    background-color: black;\\n    transition: background-color 15s;\\n    width: 100vw;\\n    height: 100vh;  \\n}\\n/* 1 */\\nh1 {\\n    font-size: 50px;\\n    \\n}\\n\\n/* 3 */\\nh1, h2 {\\n    color: white;\\n    text-align: center;\\n    font-weight: bold;\\n    font-family: Monospace;\\n    margin: 0;\\n    text-shadow: 3px 3px 15px white;\\n}\\n\\n/* 2 */\\ndiv {\\n    position: relative;\\n    top: 50%;\\n    left: 50%;\\n    transform: translate(-50%, -50%);\\n}\\n\\n/* 4 */\\n.circle {\\n    width: 300px;\\n    height: 300px;\\n    border: 5px solid white;\\n    border-radius: 50%;\\n    box-shadow: 3px 3px 15px white;\\n}\",\"js\":\"// 5\\nsetInterval(getTime, 1000);\\nfunction getTime (){\\n    var d = Date();\\n    var arr = d.split(' ');\\n    \\n    console.log(arr);\\n\\n    console.log('0：'+ arr[0]);\\n    console.log('1：'+ arr[1]);\\n    console.log('2：'+ arr[2]);\\n    console.log('3：'+ arr[3]);\\n    console.log('4：'+ arr[4]);\\n    console.log('5：'+ arr[5]);\\n    console.log('6：'+ arr[6]);\\n}\\n\\n// 6\\nsetInterval(getTime, 1000);\\nfunction getTime () {\\n    var d = new Date();\\n    var arr = d.toString().split(' ');\\n    $('#time').text(arr[4]);\\n    $('#date').text(arr[1] + ' ' + arr[2] + ', ' + arr[3]);\\n    // $('#time').text(d.getHours()+':'+d.getMinutes()+':'+d.getSeconds());\\n}\\n\\n// // 7\\n// setInterval(getTime, 1000);\\n// function getTime () {\\n//     var d = new Date();\\n//     var arr = d.toString().split(' ');\\n//     $('#time').text(arr[4]);\\n//     $('#date').text(arr[1] + ' ' + arr[2] + ', ' + arr[3])\\n//     if (d.getSeconds() == 0) {\\n//         var r = Math.floor(Math.random()*255);\\n//         var g = Math.floor(Math.random()*255);\\n//         var b = Math.floor(Math.random()*255);\\n//         var color = 'rgb(' + r + ',' + g + ',' + b + ')';\\n//         $('body').css('background-color', color);\\n//     }\\n// };\"}","created_at":"2019-05-09T15:57:07.995+08:00","updated_at":"2019-10-26T08:01:33.369+08:00","name":"5. 顏色時鐘 副本","language":"web","screenshot":{"url":"https://cdn8.koding.school/uploads/project/screenshot/66545/9816898ab7e779e35da9686828eebc7c.jpg"},"parent_id":57705,"plugin":"","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":68,"hashid":"2pds5ykn","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}