commit 34ceb87ac714590bf842bf6e19af3ffb435a681a Author: Raghu-Ch Date: Fri Jan 12 20:23:29 2018 -0500 Add Sample Calender diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e43b0f9 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.DS_Store diff --git a/index.html b/index.html new file mode 100644 index 0000000..6cd34c5 --- /dev/null +++ b/index.html @@ -0,0 +1,38 @@ + + + + + + + + + Document + + + + + + +
+

+ +
+ + + + + \ No newline at end of file diff --git a/scripts/main.js b/scripts/main.js new file mode 100644 index 0000000..3d886ad --- /dev/null +++ b/scripts/main.js @@ -0,0 +1,32 @@ +/** + * Active learning: A simple calendar + */ + +var select = document.querySelector('select'); + +var list = document.querySelector('ul'); +var h1 = document.querySelector('h1'); + +select.onchange = () => { + var choice = select.value; + var days = 31; + if (choice === 'February') { + days = 28; + } else if (choice === 'April' || choice === 'June' || choice === 'September' || choice === 'November') { + days = 30; + } else { + days = 31; + } + createCalender(days, choice); +} + +function createCalender(days, choice) { + h1.textContent = choice; + list.innerHTML = ''; + + for (let i = 1; i <= days; i++) { + var listIteam = document.createElement('li'); + listIteam.textContent = i; + list.appendChild(listIteam); + } +} diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..9811338 --- /dev/null +++ b/styles.css @@ -0,0 +1,17 @@ +h1 { + font-family: "Trebuchet MS", Verdana, sans-serif; +} +.calender ul { + padding-left: 0; +} + +.calender li { + display: block; + float: left; + width: 25%; + border: 2px solid white; + padding: 5px; + height: 40px; + background-color: rgb(23, 135, 201); + color: white; +} \ No newline at end of file