iT邦幫忙

鐵人檔案

2018 iT 邦幫忙鐵人賽
回列表
Modern Web

新手也能懂的JS30 系列

JS30 是由加拿大工程師Wes Bos所建立一系列課程,課程中可以學到很多Javascript基礎,例如如何操作Document中的DOM以及資料AP的I應用
在此新手也能懂的JS30的文章中 將以一天一章的方式完成JS30的訓練
並針對內容闡述作者的思考邏輯以及方法 希望讓新手能對Javascript有更進一步的認識
並透過作者的經驗與想法 能激發出更多不同的火花!

鐵人鍊成 | 共 30 篇文章 | 102 人訂閱 訂閱系列文 RSS系列文 團隊好想工作室第一屆鐵人賽
DAY 21

JS30-Day21-Geolocation

Day21-課題內容 在今天的課題當中,我們要透過 Geolocation API,取得我們目前位置的經緯度。[1]實作連結-大家可以把得到的經緯度貼在 goo...

2018-01-09 ‧ 由 王郁翔 分享
DAY 22

JS30-Day22-Follow Along Nav

Day22-課題內容 在今天的課題當中,我們要透過滑鼠事件屬性以及 CSS 屬性,在頁面上做出聚光燈。[1]實作連結 Element.getBoundingCl...

2018-01-10 ‧ 由 王郁翔 分享
DAY 23

JS30-Day23-Speech Synthesis

Day23-課題內容 在第20天的課題當中,我們透過 Web API 中的 SpeechRecognition 介面,將輸入的聲音轉成字串。而今天我們要透過另一...

2018-01-11 ‧ 由 王郁翔 分享
DAY 24

JS30-Day24-Sticky Nav

Day24-課題內容 進入JS30的倒數第七天,今天將透過捲動事件加上 CSS屬性的更動,讓我們的導覽列在即將滾出畫面的時候,可以固定在畫面最上方,而不會消失在...

2018-01-12 ‧ 由 王郁翔 分享
DAY 25

JS25-Event Capture, Propagation, Bubling & Once

Day25-課題內容 在今天的課題當中,我們要針對常用的 EventTarget.addEventListener 做進一步的認識。[1] EventTarge...

2018-01-13 ‧ 由 王郁翔 分享
DAY 26

JS30-Day26-Stripe Follow Along Nav

Day26-課題內容 在今天的課題當中,我們要將第22天的課題 Follow Along Link HighLighter 聚光燈的效果,做進一步的利用。當我們...

2018-01-14 ‧ 由 王郁翔 分享
DAY 27

JS30-Day27-Click & Drag

Day27-課題內容 JS30 進入倒數第四天,在今天的課題中,我們的目標是做出可以拖曳的目錄效果。[1]實作連結 進入課題 要做出拖曳的功能,我們要結合目前為...

2018-01-15 ‧ 由 王郁翔 分享
DAY 28

JS30-Day28-Video Speed Controller

Day28-課題內容 在第十一天的課題Custom Video Player中,我們製作了一個客製化影片播放器,而在今天的內容當中,我們要利用移動滑鼠來控制影片...

2018-01-16 ‧ 由 王郁翔 分享
DAY 29

JS30-Day29-Countdown Timer

Day29-課題內容 在 JS30第二天的 JS & CSS Clock 中,我們利用Javascript中的 setInterval() 方法以及CS...

2018-01-17 ‧ 由 王郁翔 分享
DAY 30

JS30-Day30-打地鼠

Day30-課題內容 終於來到 JS30的最後一天,在今天的課題中,我們將要使用一些之前所學的技能,在頁面上做出一個打地鼠的小遊戲。[1]實作連結 進入課題 要...

2018-01-18 ‧ 由 王郁翔 分享