diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..6347583 --- /dev/null +++ b/.gitattributes @@ -0,0 +1 @@ +*.html linguist-language=javascript 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`提供了一组使用`