iT邦幫忙

前端新手村相關文章
共有 116 則文章
鐵人賽 Modern Web DAY 29
鉄人28号FX 系列 第 29

技術 鉄人28号FX 鉄人29号「雲端蛇」WebFont, IconFont

★ 地圖雷奧鎮山神廟 ↓↓↓ 顯示雷奧鎮廟口位置圖 請問? 您就是? ( 找你半個月。很會躲是不是!) 雷奧鎮廟口 [鎮長]: 你終於順利走到這, 在這趟漫漫旅...

鐵人賽 自我挑戰組 DAY 24

技術 新手村24 - Sticky Nav

24 - Sticky Nav 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small steps e...

技術 鼠年全馬鐵人挑戰 WEEK 23: JavaScript 陣列處理方法

小明自從開啟了真理之門,就不斷思考著何謂「一為全,全為一」? 此時小明走著走著撿到了一本寶典 --- JavaScript 語法大全 --- 裡面寫著這麼一段話...

鐵人賽 自我挑戰組 DAY 1
溫故知新 JavaScript 系列 第 1

技術 Day1 - 前奏

HI 大家好,我是 AWEI 首次參加IT邦鐵人賽,這次想透過 30 天的時間帶大家一起來認識 JavaScript ,至於為什麼會叫溫故知新JavaScri...

鐵人賽 自我挑戰組 DAY 4

技術 新手村04 - Array Cardio Day 1

04 - Array Cardio Day 1 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small...

鐵人賽 Modern Web DAY 22
鉄人28号FX 系列 第 22

技術 鉄人28号FX 鉄人22号「速記豹」font properties

★ 地圖雷奧鎮近郊處 ↓↓↓ 顯示雷奧鎮位置圖 就在那了!! ( 抬頭一看 ) 只要再往東走,就能順利到達城鎮~~ :站住!! 近郊衛士 [速記豹]: 此為進入...

鐵人賽 Modern Web DAY 8
實作經典 JavaScript 30 系列 第 8

技術 Day08: Ajax Type Ahead with fetch() (一)

WES BOS系列影片 Alex快速導讀系列影片 學習重點: 1.使用fetch()來發送請求,串接遠端資料 2.嘗試利用正規表達式來篩選資料 使用fetch(...

鐵人賽 Modern Web DAY 11
實作經典 JavaScript 30 系列 第 11

技術 Day11: 在Canvas畫布上,用滑鼠畫畫(ㄧ)

WES BOS系列影片 Alex快速導讀系列影片 今天要用滑鼠在網頁上畫畫。 初探Canvas元素的使用方式,可與MDN的Canvas教學手冊搭配服用 但若是只...

鐵人賽 Modern Web DAY 7
實作經典 JavaScript 30 系列 第 7

技術 Day07: Flexbox + JavaScript 製作手風琴版面

WES BOS系列影片 Alex快速導讀系列影片 作者可能怕我們忘記flex怎麼用,在中間穿插了這個課程, 練習JS之餘,也能夠再複習一下flexbox 所以在...

鐵人賽 自我挑戰組 DAY 13

技術 新手村13 - Slide in on Scroll

13 - Slide in on Scroll 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small...

鐵人賽 Modern Web DAY 14
實作經典 JavaScript 30 系列 第 14

技術 Day14: 一次選取想要選取的checkbox

WES BOS系列影片 Alex快速導讀系列影片 今天要嘗試做一個todo-list的小功能, 按下shift鍵時,可以一次勾選代辦事項。 1.首先抓出所有ch...

鐵人賽 自我挑戰組 DAY 11

技術 新手村11 - Custom Video Player

11 - Custom Video Player 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? smal...

鐵人賽 自我挑戰組 DAY 30

技術 新手村30 - Whack A Mole

30 - Whack A Mole 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small steps...

鐵人賽 Modern Web DAY 28
實作經典 JavaScript 30 系列 第 28

技術 Day28: Sticky Nav

WES BOS系列影片 Alex快速導讀系列影片 今天針對常用的Navbar做fix的狀態 這真的是很常見的功能,可以立馬學起來 1.先抓出NavBar的位置,...

鐵人賽 Modern Web DAY 3
實作經典 JavaScript 30 系列 第 3

技術 Day03:來做個鍵盤鼓手(二)

接續第一天的練習, 我們成功加上了樣式,卻沒有移除它。 開始來想辦法在我們不需要這個樣式時,將它移除 JS的監聽器也是可以監聽元素的變化, 這時我們監聽的動作會...

鐵人賽 自我挑戰組 DAY 28

技術 新手村28 - Video Speed Controller

28 - Video Speed Controller 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? s...

鐵人賽 自我挑戰組 DAY 15

技術 新手村15 - LocalStorage

15 - LocalStorage 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small steps...

鐵人賽 Modern Web DAY 25
實作經典 JavaScript 30 系列 第 25

技術 Day25: Adding Up Times With Reduce

WES BOS系列影片 Alex快速導讀系列影片 今天的練習會用到reduce() 還有用一些數學的運算,將秒數換算成時分秒 然後又複習了一下dataset的用...

鐵人賽 自我挑戰組 DAY 14

技術 新手村14 - JS Reference VS Copy

14 - JS Reference VS Copy 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? sma...

鐵人賽 自我挑戰組 DAY 29

技術 新手村29 - Countdown Timer

29 - Countdown Timer 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small st...

鐵人賽 Modern Web DAY 20
鉄人28号FX 系列 第 20

技術 鉄人28号FX 鉄人20号「省略蚊」text-overflow

★ 地圖西北方峽谷森林 ↓↓↓ 顯示峽谷森林位置圖 :只要過了這沼澤,就是森林出口了!! 倒是該怎麼走過去呢? 苦惱樣 ) 眼前黑一片。 (゜皿。) 森林沼澤...

鐵人賽 Modern Web DAY 6
實作經典 JavaScript 30 系列 第 6

技術 Day06: 針對陣列的操作練習(二)

WES BOS系列影片 Alex快速導讀系列影片 做完基礎陣列練習後,來做些進階的練習 進階練習目標 : 6.Sort the inventors by yea...

鐵人賽 自我挑戰組 DAY 22

技術 新手村22 - Follow Along Link Highlighter

22 - Follow Along Link Highlighter 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaSc...

鐵人賽 Modern Web DAY 9
實作經典 JavaScript 30 系列 第 9

技術 Day09: Ajax Type Ahead with fetch()(二)

WES BOS系列影片 Alex快速導讀系列影片 再來,進入學習的第二個重點部分- 嘗試利用正規表達式來篩選資料 在此之前,先將前置作業完成 1.先抓出需要設置...

鐵人賽 自我挑戰組 DAY 5

技術 新手村05 - Flex Panel Gallery

05 - Flex Panel Gallery 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small...

鐵人賽 自我挑戰組 DAY 27

技術 新手村27 - Click and Drag

27 - Click and Drag 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small ste...

鐵人賽 自我挑戰組 DAY 12

技術 新手村12 - Key Sequence Detection

12 - Key Sequence Detection 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? s...

鐵人賽 Modern Web DAY 18
實作經典 JavaScript 30 系列 第 18

技術 Day 18 : 為網頁增加圖片動畫效果

WES BOS系列影片 Alex快速導讀系列影片 今天要為靜態的文章, 添加一些圖片進場的動畫效果 練習抓取螢幕與圖片的長度, 進而控制圖片的進場時間。 1.先...

鐵人賽 Modern Web DAY 17
實作經典 JavaScript 30 系列 第 17

技術 Day17: 為網站設計一個彩蛋

WES BOS系列影片 Alex快速導讀系列影片 今天的實例用到了cornify.js這個套件, 功能類似打電動時要放大絕招前, 一定要輸入一段指令串。 例如:...

鐵人賽 自我挑戰組 DAY 18

技術 新手村18 - Adding Up Times with Reduce

18 - Adding Up Times with Reduce 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScri...