系列文章
JS30-Day21-Geolocation
Day21-課題內容 在今天的課題當中，我們要透過 Geolocation API，取得我們目前位置的經緯度。[1]實作連結-大家可以把得到的經緯度貼在 goo...
JS30-Day22-Follow Along Nav
Day22-課題內容 在今天的課題當中，我們要透過滑鼠事件屬性以及 CSS 屬性，在頁面上做出聚光燈。[1]實作連結 Element.getBoundingCl...
JS30-Day23-Speech Synthesis
Day23-課題內容 在第20天的課題當中，我們透過 Web API 中的 SpeechRecognition 介面，將輸入的聲音轉成字串。而今天我們要透過另一...
JS30-Day24-Sticky Nav
Day24-課題內容 進入JS30的倒數第七天，今天將透過捲動事件加上 CSS屬性的更動，讓我們的導覽列在即將滾出畫面的時候，可以固定在畫面最上方，而不會消失在...
JS25-Event Capture, Propagation, Bubling & Once
Day25-課題內容 在今天的課題當中，我們要針對常用的 EventTarget.addEventListener 做進一步的認識。[1] EventTarge...
JS30-Day26-Stripe Follow Along Nav
Day26-課題內容 在今天的課題當中，我們要將第22天的課題 Follow Along Link HighLighter 聚光燈的效果，做進一步的利用。當我們...
JS30-Day27-Click & Drag
Day27-課題內容 JS30 進入倒數第四天，在今天的課題中，我們的目標是做出可以拖曳的目錄效果。[1]實作連結 進入課題 要做出拖曳的功能，我們要結合目前為...
JS30-Day28-Video Speed Controller
Day28-課題內容 在第十一天的課題Custom Video Player中，我們製作了一個客製化影片播放器，而在今天的內容當中，我們要利用移動滑鼠來控制影片...
JS30-Day29-Countdown Timer
Day29-課題內容 在 JS30第二天的 JS & CSS Clock 中，我們利用Javascript中的 setInterval() 方法以及CS...
JS30-Day30-打地鼠
Day30-課題內容 終於來到 JS30的最後一天，在今天的課題中，我們將要使用一些之前所學的技能，在頁面上做出一個打地鼠的小遊戲。[1]實作連結 進入課題 要...