成品連結:Drum Kit 事前準備 成品預期效果 當按下指定按鍵時,播放音效以及渲染畫面(新增/移除 class 'playing') 步驟 監聽畫面按鍵...
成品連結:JS & CSS Clock 來到第二天啦!今天要做的是時鐘,話不多說,我們就開始吧~ 事前準備 步驟 設定每秒更新畫面(setInterv...
成品連結:CSS Variables 第三天我們要來利用 JS 操作 CSS,同時也會用到 CSS 內建的變數功能 (類似 SASS/SCSS 的變數功能)。...
頁面連結:Array Cardio Day 1 (請開啟 console 看結果) 今天稍微輕鬆一點,不會寫出程式來,而只是複習一下 array 的各種 met...
成品連結:Flex Panel Gallery,HTML & CSS 程式碼 今天的作品其實寫的 JS code 並不多,與前面有許多重複的地方,反而較...
完成作品:Type Ahead、程式碼 這天預期的結果是當搜尋時搜尋結果與搜尋框相同的文字會被反白,所以嚴格來說我並沒有達成預期的結果,但還是請大家將就一點看了...
頁面連結(請打開 console 查看) 今天不寫程式,學習 (或是複習) 一些 Array methods 吧! 先列出本篇所涵蓋的 methods so...
今天要做的是操作 Canvas,並做出類似小畫家的效果,隨意在畫布上作畫。其實在做這一天內容前我沒有接觸過 Canvas,只好臨時抱佛腳趕快學一些基本的東西,還...
頁面連結(請打開 console 查看) 今天同樣不會做出東西,而是學習 console 的各種小技巧!大家可以將下面示範的程式碼貼在瀏覽器玩看看 consol...
成品連結:Hold Shift and Check Checkboxes、程式碼 今天要做的是選單多重選取!這功能就像是當你在資料夾選取一個項目,然後按著 sh...