JavaScript 30 是國外著名的JS開發者Wes Bos提供的免費30天課程,課程不只有JS的使用,更包括Html,Css的相互運用。希望透過Js30的實作讓我更加理解JS的運作,並寫點心得與筆記跟大家一起探討Js的世界。
Day1 JS: Drum Kit Demo 第1天的實作是建立一個類似打鼓就產生音效的網頁,當點擊鍵盤時會讓網頁的element產生音效和動態的畫面效果。 首...
Day2 JS + CSS Clock Demo 在網頁畫面產生一個時鐘,能及時呈現目前的時間。 並且類似時鐘會有3個指針,每個指針會隨著時間的變化,有著相對應...
Day3 Playing with CSS Variables and JS Demo 在網頁產生三個控制元件<input type="rang...
Day4 Array Cardio Day 1 Demo 這一個章節主要是利用Javascript的Array物件中方法做資料處理,在第四天會有幾個語法的練習...
Day5 Flex Panels Image Gallery Demo 使用Css的flex來製作動態收縮展開的畫面。 在畫面會有五張圖<div>垂...
Day6 Ajax Type Ahead Demo 第六天的實作是練習Javascript非同步執行。 首先利用fetch物件建立接收資料的接口,fetch物件...
Day7 Array Cardio Day 2 Demo 這一個章節跟第四天一樣主要是利用Javascript的Array物件中方法做資料處理。 第一個語法是...
Day8 Fun with HTML5 Canvas Demo 第8天的實作是網頁做出類似畫布,滑鼠在上方拖移會有顏色的產生,顏色會隨著滑鼠移動而變化,大小也是...
Day9 14 Must Know Dev Tools Tricks Demo 第九天主要學習的是console的運用。 何為console? 主要功能為:...
Day10 Hold Shift to Check Multiple Checkboxes Demo 第10天的實作目標是在列表中,當點選其中一個選項後,再按s...