From a9b940d7c3b412744ed04e48d5ad0e773356c5f0 Mon Sep 17 00:00:00 2001 From: dashnowords <389399428@qq.com> Date: Tue, 17 Jul 2018 21:53:12 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=BA=86readme=E6=96=87?= =?UTF-8?q?=E4=BB=B6=E4=B8=AD=E7=9A=84=E7=A4=BA=E6=84=8F=E5=9B=BE=E9=93=BE?= =?UTF-8?q?=E6=8E=A5=20=E6=9B=B4=E6=96=B0=E4=BA=86=E5=8E=9F=E5=8D=8F?= =?UTF-8?q?=E4=BD=9C=E8=80=85=E3=80=90=E5=A4=A7=E5=8F=B2=E5=BF=AB=E8=B7=91?= =?UTF-8?q?=E3=80=91=E7=9A=84=E4=BF=A1=E6=81=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/issue_template.md | 12 ++++++++ 01 - JavaScript Drum Kit/README.md | 2 +- 02 - JS + CSS Clock/README.md | 2 +- 03 - CSS Variables/README.md | 2 +- 04 - Array Cardio Day 1/README.md | 2 +- 04 - Array Cardio Day 1/index-SOYAINE.html | 2 +- 05 - Flex Panel Gallery/README.md | 2 +- 06 - Type Ahead/README.md | 2 +- 07 - Array Cardio Day 2/README.md | 2 +- 08 - Fun with HTML5 Canvas/README.md | 2 +- 09 - Dev Tools Domination/README.md | 2 +- .../README.md | 2 +- 12 - Key Sequence Detection/README.md | 2 +- 13 - Slide in on Scroll/README.md | 2 +- .../README.md | 2 +- 15 - LocalStorage/README.md | 2 +- 16 - Mouse Move Shadow/README.md | 4 +-- 17 - Sort Without Articles/README.md | 4 +-- 18 - AddingUpTimesWithReduce/README.md | 4 +-- 19 - Webcam Fun/README.md | 4 +-- 20 - Speech Detection/README.md | 4 +-- 21 - Geolocation/README.md | 4 +-- 22 - Follow Along Link Highlighter/README.md | 4 +-- 23 - Speech Synthesis/README.md | 4 +-- 24 - Sticky Nav/README.md | 4 +-- 25 - Event Related/README.md | 4 +-- 26 - Strip Follow Along Nav/README.md | 4 +-- 27 - Click and Drag/README.md | 4 +-- 28 - Video Speed Controller/README.md | 4 +-- 29 - Countdown Timer/README.md | 4 +-- README.md | 28 +++++++++---------- 31 files changed, 69 insertions(+), 57 deletions(-) create mode 100644 .github/issue_template.md diff --git a/.github/issue_template.md b/.github/issue_template.md new file mode 100644 index 0000000..5834ef8 --- /dev/null +++ b/.github/issue_template.md @@ -0,0 +1,12 @@ +Title: 标号-题目-类型 问题简述 + +例子: + +``` +11 - Custom Video Player - readme: LocalStorage 補充 +11 - Custom Video Player - js: const 写法错误 +``` + +说明中最好提供问题所在的具体位置链接,链接获取方法: +1. Markdown 文档下,鼠标移动至你有问题的小标题,点击其左侧的链接图标,复制地址栏的地址即可。如:https://github.com/soyaine/JavaScript30/tree/master/11%20-%20Custom%20Video%20Player#图标切换 +2. 代码文档下,点击某一行左侧标号,复制地址栏地址即可,如 https://github.com/soyaine/JavaScript30/blob/master/11%20-%20Custom%20Video%20Player/index.html#L20 diff --git a/01 - JavaScript Drum Kit/README.md b/01 - JavaScript Drum Kit/README.md index fb3822a..52e2d22 100644 --- a/01 - JavaScript Drum Kit/README.md +++ b/01 - JavaScript Drum Kit/README.md @@ -1,6 +1,6 @@ # 01 JavaScript Drum Kit 中文指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 1 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/02 - JS + CSS Clock/README.md b/02 - JS + CSS Clock/README.md index 31544fe..7e808f2 100644 --- a/02 - JS + CSS Clock/README.md +++ b/02 - JS + CSS Clock/README.md @@ -1,6 +1,6 @@ # 02 纯 JS、CSS 时钟 中文指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 2 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2016-12-21 diff --git a/03 - CSS Variables/README.md b/03 - CSS Variables/README.md index fa175ef..e28b206 100644 --- a/03 - CSS Variables/README.md +++ b/03 - CSS Variables/README.md @@ -1,6 +1,6 @@ # 03 CSS Variable -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 3 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/04 - Array Cardio Day 1/README.md b/04 - Array Cardio Day 1/README.md index c6e08e1..1e4215d 100644 --- a/04 - Array Cardio Day 1/README.md +++ b/04 - Array Cardio Day 1/README.md @@ -1,6 +1,6 @@ # 04 Array Cardio 💪 指南一 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 4 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/04 - Array Cardio Day 1/index-SOYAINE.html b/04 - Array Cardio Day 1/index-SOYAINE.html index 6de312b..7419899 100644 --- a/04 - Array Cardio Day 1/index-SOYAINE.html +++ b/04 - Array Cardio Day 1/index-SOYAINE.html @@ -113,7 +113,7 @@ // 下面是我在豆瓣里筛选书名里含有 CSS 的书的代码 // https://book.douban.com/tag/web -// const links = document.querySelectorAll('.subject-list h2 a'); +// const links = Array.from(document.querySelectorAll('.subject-list h2 a')); // const book = links // .map(link => link.title) // .filter(title => title.includes('CSS')); diff --git a/05 - Flex Panel Gallery/README.md b/05 - Flex Panel Gallery/README.md index af61333..90a1a04 100644 --- a/05 - Flex Panel Gallery/README.md +++ b/05 - Flex Panel Gallery/README.md @@ -1,6 +1,6 @@ # 05 Flex 实现可伸缩的图片墙 中文指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 5 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/06 - Type Ahead/README.md b/06 - Type Ahead/README.md index 38845b5..8a1f093 100644 --- a/06 - Type Ahead/README.md +++ b/06 - Type Ahead/README.md @@ -1,6 +1,6 @@ # 06 Fetch 结合 filter 实现快速匹配古诗 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 6 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/07 - Array Cardio Day 2/README.md b/07 - Array Cardio Day 2/README.md index 767a1f7..2a2e85d 100644 --- a/07 - Array Cardio Day 2/README.md +++ b/07 - Array Cardio Day 2/README.md @@ -1,6 +1,6 @@ # 07 Array Cardio 💪 指南二 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 7 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/08 - Fun with HTML5 Canvas/README.md b/08 - Fun with HTML5 Canvas/README.md index f9397ef..3cf6bd9 100644 --- a/08 - Fun with HTML5 Canvas/README.md +++ b/08 - Fun with HTML5 Canvas/README.md @@ -1,6 +1,6 @@ # 08 HTML5 Canvas 实现彩虹画笔绘画板指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 8 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) ## 实现效果 diff --git a/09 - Dev Tools Domination/README.md b/09 - Dev Tools Domination/README.md index 3ec6934..f103fc4 100644 --- a/09 - Dev Tools Domination/README.md +++ b/09 - Dev Tools Domination/README.md @@ -1,6 +1,6 @@ # 09 Console 调试技巧指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 9 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2017-01-06 diff --git a/10 - Hold Shift and Check Checkboxes/README.md b/10 - Hold Shift and Check Checkboxes/README.md index 056f796..dbb6c5f 100644 --- a/10 - Hold Shift and Check Checkboxes/README.md +++ b/10 - Hold Shift and Check Checkboxes/README.md @@ -1,6 +1,6 @@ # 10 JS 实现 Checkbox 中按住 Shift 的多选功能 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 10 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2017-01-07 diff --git a/12 - Key Sequence Detection/README.md b/12 - Key Sequence Detection/README.md index 0b84335..9956f18 100644 --- a/12 - Key Sequence Detection/README.md +++ b/12 - Key Sequence Detection/README.md @@ -1,6 +1,6 @@ # 12 键盘输入序列的验证指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 12 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2017-02-27 diff --git a/13 - Slide in on Scroll/README.md b/13 - Slide in on Scroll/README.md index 22bb0d5..182908c 100644 --- a/13 - Slide in on Scroll/README.md +++ b/13 - Slide in on Scroll/README.md @@ -1,6 +1,6 @@ # 13 图片随屏幕滚动而滑入滑出的效果指南 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 13 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2017-07-14 diff --git a/14 - JavaScript References VS Copying/README.md b/14 - JavaScript References VS Copying/README.md index 2af71f5..05dcef8 100644 --- a/14 - JavaScript References VS Copying/README.md +++ b/14 - JavaScript References VS Copying/README.md @@ -1,6 +1,6 @@ # 14 JS中的引用与复制 -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 14 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2017-07-19 diff --git a/15 - LocalStorage/README.md b/15 - LocalStorage/README.md index 80173b6..3793de1 100644 --- a/15 - LocalStorage/README.md +++ b/15 - LocalStorage/README.md @@ -1,6 +1,6 @@ # 15 LocalStorage -> 作者:©[缉熙Soyaine](https://github.com/soyaine) +> 作者:©[未枝丫](https://github.com/soyaine) > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 15 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) > 创建时间:2017-07-24 diff --git a/16 - Mouse Move Shadow/README.md b/16 - Mouse Move Shadow/README.md index 6eb91ee..984c795 100644 --- a/16 - Mouse Move Shadow/README.md +++ b/16 - Mouse Move Shadow/README.md @@ -1,6 +1,6 @@ # 16 文字阴影的鼠标随动效果 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Web Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 16 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -11,7 +11,7 @@ 初始文件`index-start.html`中提供了一个包含了`h1`元素的`div`元素,`h1`元素已经设置了`text-Shadow`的样式。本次编程挑战中需要完成的效果是根据用户当前的鼠标位置来操纵文字阴影的位置。 ## 实现效果 -![结果展示](https://github.com/dashrun/vanilla-javascript-30/blob/master/day16-mouseMoveShadow/effects.png) +![结果展示](https://github.com/dashnowords/JavaScript30/blob/master/16%20-%20Mouse%20Move%20Shadow/effects.png) ## 基本知识 `text-shadow`样式为标准CSS3样式,用于添加**一个或多个**文字阴影,用于其的语法格式为: diff --git a/17 - Sort Without Articles/README.md b/17 - Sort Without Articles/README.md index a42fa14..2bed663 100644 --- a/17 - Sort Without Articles/README.md +++ b/17 - Sort Without Articles/README.md @@ -1,6 +1,6 @@ # 17 数组的去前缀排序 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Web Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 17 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -11,7 +11,7 @@ 初始文件`index-start.html`中提供了一个无序列表元素,并在`script`标签中提供了一个字符串数组。请为这些字符串排序,要求去除字符串中的`The`,`A`以及`An`的前缀后再进行排序,并把排序后的结果作为列表项展示在无序列表中。 ## 实现效果 -![结果展示](https://github.com/dashrun/vanilla-javascript-30/blob/master/day17-SortWithoutArticles/effects.png) +![结果展示](https://github.com/soyaine/JavaScript30/blob/master/17%20-%20Sort%20Without%20Articles/effects.png) ## 基本思路 1.基本的编程任务有两个要点,即**排序**和**展示**;
diff --git a/18 - AddingUpTimesWithReduce/README.md b/18 - AddingUpTimesWithReduce/README.md index 46c0873..c493459 100644 --- a/18 - AddingUpTimesWithReduce/README.md +++ b/18 - AddingUpTimesWithReduce/README.md @@ -1,6 +1,6 @@ # 18 使用reduce进行时间累加 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Web Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 18 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -11,7 +11,7 @@ 初始文件`index-start.html`中提供了一个包含多个列表项的无序列表元素,每一个列表项均添加了`data-time`属性,该属性用**分**和**秒**表示了时间。要求将所有的时间累加在一起,并用`时:分:秒`来表示计算的结果。 ## 实现效果 -![结果展示](https://github.com/dashrun/vanilla-javascript-30/blob/master/day18-AddingUpTimesWithReduce/effects.png) +![结果展示](https://github.com/soyaine/JavaScript30/blob/master/18%20-%20AddingUpTimesWithReduce/effects.png) ## 基本思路 1.取得所有`li`中`data-time`属性的值,将时间换算为秒并累加求得总时间(单位:秒);
diff --git a/19 - Webcam Fun/README.md b/19 - Webcam Fun/README.md index f5f772f..389458d 100644 --- a/19 - Webcam Fun/README.md +++ b/19 - Webcam Fun/README.md @@ -1,6 +1,6 @@ # 19 Webcam Fun 中文指南 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 19 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -16,7 +16,7 @@ 4.及使用滑块来改变图像的色彩。 ## 实现效果 -![结果展示](https://github.com/dashrun/vanilla-javascript-30/blob/master/19%20-%20Webcam%20Fun/effects.png) +![结果展示](https://github.com/soyaine/JavaScript30/blob/master/19%20-%20Webcam%20Fun/effects.png) ## 相关知识 1.`window.navigator`对象 diff --git a/20 - Speech Detection/README.md b/20 - Speech Detection/README.md index a2070a0..5b62c17 100644 --- a/20 - Speech Detection/README.md +++ b/20 - Speech Detection/README.md @@ -1,6 +1,6 @@ # 20 Speech Detection 中文指南 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 20 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -12,7 +12,7 @@ 说明:由于只有chrome浏览器实现了该接口,而语音识别需要将捕捉到的信息发送至google服务器进行处理,故本文档只提供解决思路和参考代码。 ## 实现效果 -![结果展示](https://github.com/dashrun/vanilla-javascript-30/blob/master/20%20-%20Speech%20Detection/effects.png) +![结果展示](https://github.com/soyaine/JavaScript30/blob/master/20%20-%20Speech%20Detection/effects.png) ## 相关知识 有关语音识别接口`SpeechRecognition`的说明,可查看[MDN](https://developer.mozilla.org/zh-CN/docs/Web/API/SpeechRecognition)中的相关解释。 diff --git a/21 - Geolocation/README.md b/21 - Geolocation/README.md index c4f8b17..7c44d84 100644 --- a/21 - Geolocation/README.md +++ b/21 - Geolocation/README.md @@ -1,6 +1,6 @@ # 21 Geolocation 中文指南 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 21 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -11,7 +11,7 @@ 本次的挑战任务,是利用浏览器内置`Web Geolocation API`,将获取到的地理位置及相关坐标,与`index-start.html`中的可视化指南针连接在一起。 ## 实现效果 -![结果展示](https://github.com/dashrun/vanilla-javascript-30/blob/master/21%20-%20Geolocation/effects.png) +![结果展示](https://github.com/soyaine/JavaScript30/blob/master/21%20-%20Geolocation/effects.png) 由于笔记本电脑一般不带速度及方向传感器,从结果中可以看到返回值中`heading`及`speed`键值均为`null`,为演示可视化效果,代码中采用手动赋值的方式进行演示。 ## 相关知识 diff --git a/22 - Follow Along Link Highlighter/README.md b/22 - Follow Along Link Highlighter/README.md index cd7a55f..36bd906 100644 --- a/22 - Follow Along Link Highlighter/README.md +++ b/22 - Follow Along Link Highlighter/README.md @@ -1,6 +1,6 @@ # 22 Follow Along Link Highliter 中文指南 -> 本篇作者:©[大史快跑Dashrun](https://github.com/dashrun)——Chinasoft Frontend Developer +> 本篇作者:©[大史不说话](https://github.com/dashnowords)——Chinasoft Frontend Web Developer > 简介:[JavaScript30](https://javascript30.com) 是 [Wes Bos](https://github.com/wesbos) 推出的一个 30 天挑战。项目免费提供了 30 个视频教程、30 个挑战的起始文档和 30 个挑战解决方案源代码。目的是帮助人们用纯 JavaScript 来写东西,不借助框架和库,也不使用编译器和引用。现在你看到的是这系列指南的第 22 篇。完整指南在 [GitHub](https://github.com/soyaine/JavaScript30),喜欢请 Star 哦♪(^∇^*) @@ -11,7 +11,7 @@ 初始文档`index-start.html`提供了一组使用`