iT邦幫忙

鐵人檔案

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

寫JS30天 系列

跟著JS30初步了解javascript

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

JS 30 - 11 - Custom Video Player

要自製一個video player需要做的有 播放:點擊播放鍵、影片播放位置會play()/pause() 控制音量的handler 控制播放速度handl...

2018-10-26 ‧ 由 JasonYang 分享
DAY 12

JS 30 -12 - Key Sequence Detection

本篇要研究的是konami code當使用者在網頁輸入特定密碼串時,會觸發特效 首先我們先了解什麼是konami code這是一個遊戲公司konami在旗下遊戲...

2018-10-27 ‧ 由 JasonYang 分享
DAY 13

JS 30 - 13 - Slide in on Scroll

首先我們先將想要顯現圖片的elements都選起來再監聽window的捲軸滾動事件 const slideImages = document.querySele...

2018-10-28 ‧ 由 JasonYang 分享
DAY 14

JS 30 - 14 - Reference Copy or Value Copy

call by value 在js中,基本型別的number、variable、 function exchangeNum(a, b) { let cach...

2018-10-29 ‧ 由 JasonYang 分享
DAY 15

JS 30 - 15 - Local Storage

讓一個todolist能在關閉瀏覽器後,仍然能保有資料 html <div class="wrapper"> <h...

2018-10-30 ‧ 由 JasonYang 分享
DAY 16

JS 30 - 16 - Mouse Move Shadow

首先我們先來看看html <div class="hero"> <h1 contenteditable>?卍...

2018-10-31 ‧ 由 JasonYang 分享
DAY 17

JS 30 -17 -Sort without article

當我們有一串含有中文和英文歌名的歌單 const bands = ['The Plot in You', 'The Devil Wears Prada','...

2018-11-01 ‧ 由 JasonYang 分享
DAY 18

JS30 - 18 - Adding up time

我們在網頁上有許多影片 <ul class="videos"> <li data-time="5:43&...

2018-11-02 ‧ 由 JasonYang 分享
DAY 19

JS30 - 19 - Webcam Fun - part 1

目標 我們要得到視訊鏡頭的影片、可以拍照、預覽照片和下載照片 可以為照片增加效果 我們先來觀察一下html吧 <div class="pho...

2018-11-03 ‧ 由 JasonYang 分享
DAY 20

JS30 - 20 - Webcam Fun -part 2

昨天我們已經成功取得攝像頭的影片並畫到canvas上了今天我們要取出canvas的圖經過一些改造後再次畫到canvas上我們今天除了影片中教學的「泛紅」、「色相...

2018-11-04 ‧ 由 JasonYang 分享