├── index.html ├── myscript.js └── mystyle.css /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Day of the week 8 | 9 | 10 | 11 | 12 |

13 |

Today is :

14 |

15 | Display day of the week.
16 | Display a quote 17 |

18 | 19 |

20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /myscript.js: -------------------------------------------------------------------------------- 1 | var d = new Date(); 2 | var weekday = new Array(7); 3 | weekday[0]= "Sunday"; 4 | weekday[1] = "Monday"; 5 | weekday[2] = "Tuesday"; 6 | weekday[3] = "Wednesday"; 7 | weekday[4] = "Thursday"; 8 | weekday[5] = "Friday"; 9 | weekday[6] = "Saturday"; 10 | 11 | var date2 = new Date(); 12 | var weekday2 = new Array(7); 13 | weekday2[0]= "Time to chillax!"; 14 | weekday2[1] = "Monday morning blues!"; 15 | weekday2[2] = "Taco Time!"; 16 | weekday2[3] = "Two more days to the weekend."; 17 | weekday2[4] = "The weekend is almost here..."; 18 | weekday2[5] = "Weekend is here!"; 19 | weekday2[6] = "Time to party!."; 20 | 21 | var n = weekday[d.getDay()]; 22 | var n2 = weekday2[date2.getDay()]; 23 | 24 | var displayWeekday = document.getElementById('weekday'); 25 | var phrase = document.getElementById('phrase'); 26 | 27 | whatDayIsIt(); 28 | 29 | function whatDayIsIt() { 30 | 31 | displayWeekday.innerText = n ; 32 | phrase.innerText = n2; 33 | 34 | } -------------------------------------------------------------------------------- /mystyle.css: -------------------------------------------------------------------------------- 1 | 2 | body { 3 | font-family:Helvetica, Arial, sans-serif; 4 | margin: 50px; 5 | background:#fff; 6 | } 7 | 8 | 9 | #container { 10 | 11 | width:650px; 12 | height:350px; 13 | background-color: #00ffff; 14 | margin:auto; /* This centers block elements like divs */ 15 | border-radius: 30px; 16 | 17 | } 18 | h1 { 19 | font-size: 47px; 20 | font-weight: 600px; 21 | color:#fff; 22 | text-transform:uppercase; 23 | margin-bottom:20px; 24 | margin-left: 170px; 25 | background:#0000ff; 26 | padding: 10px; 27 | border-radius: 5px; 28 | display:inline-block; 29 | } 30 | 31 | #weekday { 32 | font-size: 80px; 33 | color:#dd5800; 34 | font-weight: 800px; 35 | margin-left: 170px; 36 | } 37 | 38 | #phrase { 39 | font-size: 40px; 40 | color:#0000ff; 41 | font-weight: 800; 42 | margin-left: 170px; 43 | } --------------------------------------------------------------------------------