获得徽章 15
#青训营笔记创作活动#
1月27日 打卡day50
今日学习
实现思路:生成一个 canvas 元素,让 canvas 元素与需要划词高亮功能的文本容器元素等宽高,并且重叠在文本容器上,划词的时候获取划词区域的文本节点相对于文本容器的位置信息,然后通过这些位置信息进行高亮背景的渲染。
1月27日 打卡day50
今日学习
实现思路:生成一个 canvas 元素,让 canvas 元素与需要划词高亮功能的文本容器元素等宽高,并且重叠在文本容器上,划词的时候获取划词区域的文本节点相对于文本容器的位置信息,然后通过这些位置信息进行高亮背景的渲染。
展开
评论
点赞
#青训营笔记创作活动#
1月26日 打卡day49
今日学习
通过对一个组件库的开发来全面认识熟悉前端工程化的配置,系统的理解工程化中各个工具所起到的作用,并且将其最终可以应用到你的团队当中去,真正的实现工程化的价值,帮助你的团队提效,实现作为前端工程师的价值。
1月26日 打卡day49
今日学习
通过对一个组件库的开发来全面认识熟悉前端工程化的配置,系统的理解工程化中各个工具所起到的作用,并且将其最终可以应用到你的团队当中去,真正的实现工程化的价值,帮助你的团队提效,实现作为前端工程师的价值。
展开
评论
点赞
#青训营笔记创作活动#
1月25日 打卡day48
今日学习
ProTable 功能∶表格内容自适应屏幕宽高,溢出内容表格内部滚动(flex 布局)
表格搜索、重置、分页查询 Hooks 封装 (页面使用不会存在任何搜索、重置、分页查询逻辑)
表格数据操作 Hooks 封装 (单条数据删除、批量删除、重置密码、状态切换等操作)
表格数据多选 Hooks 封装 (支持现跨页勾选数据)
1月25日 打卡day48
今日学习
ProTable 功能∶表格内容自适应屏幕宽高,溢出内容表格内部滚动(flex 布局)
表格搜索、重置、分页查询 Hooks 封装 (页面使用不会存在任何搜索、重置、分页查询逻辑)
表格数据操作 Hooks 封装 (单条数据删除、批量删除、重置密码、状态切换等操作)
表格数据多选 Hooks 封装 (支持现跨页勾选数据)
展开
评论
点赞
#青训营笔记创作活动#
1月24日 打卡day47
今日学习
今天学习了制作一个网页灯泡的效果。
一般探照灯都是在顶上的,所以就需要用一根电线连接在顶部
灯杆已经有了,那就加一个灯罩就行了
灯泡也是比较简单的样式,一个半圆加一部分阴影即可追光就是通过一个边框线画出来的
文字通过定位居中之后,刚好显示在灯光动画效果范围之内
1月24日 打卡day47
今日学习
今天学习了制作一个网页灯泡的效果。
一般探照灯都是在顶上的,所以就需要用一根电线连接在顶部
灯杆已经有了,那就加一个灯罩就行了
灯泡也是比较简单的样式,一个半圆加一部分阴影即可追光就是通过一个边框线画出来的
文字通过定位居中之后,刚好显示在灯光动画效果范围之内
展开
评论
点赞
#青训营笔记创作活动#
1月23日 打卡day46
今日学习
今天学习了一些常用的CSS动画效果,通过gif图加代码的形式让你更好的理解和使用。比如淡入效果,淡出效果,弹跳效果。
1月23日 打卡day46
今日学习
今天学习了一些常用的CSS动画效果,通过gif图加代码的形式让你更好的理解和使用。比如淡入效果,淡出效果,弹跳效果。
评论
点赞
#青训营笔记创作活动#
1月22日 打卡day45
今日学习
使用方法
npm install typedoc
配置typedoc.json
执行命令:typedoc --out api src/index.ts 生成API站点
1月22日 打卡day45
今日学习
使用方法
npm install typedoc
配置typedoc.json
执行命令:typedoc --out api src/index.ts 生成API站点
展开
评论
点赞
#青训营笔记创作活动#
1月21日 打卡day44
今日学习
今天学习了20个常用的git用法。
Git 分为 4 个工作区:
工作区:指在本地仓库中的全部代码区域;
暂存区:指在本地仓库中通过 git add 后的代码区域;
本地仓库:指在本地仓库中的 git commit 后的代码区域;
远程仓库:远程仓库指的托管代码的服务器。
1月21日 打卡day44
今日学习
今天学习了20个常用的git用法。
Git 分为 4 个工作区:
工作区:指在本地仓库中的全部代码区域;
暂存区:指在本地仓库中通过 git add 后的代码区域;
本地仓库:指在本地仓库中的 git commit 后的代码区域;
远程仓库:远程仓库指的托管代码的服务器。
展开
评论
点赞
#青训营笔记创作活动#
1月20日 打卡day43
今日学习
今天学习了四种css取代js的代码
①颜色选择器∶通过设置 input 标签属性,就自带这个颜色选择功能了~②打字效果③ 滑顶/触底效果④ 顺滑切图
1月20日 打卡day43
今日学习
今天学习了四种css取代js的代码
①颜色选择器∶通过设置 input 标签属性,就自带这个颜色选择功能了~②打字效果③ 滑顶/触底效果④ 顺滑切图
展开
评论
点赞
#青训营笔记创作活动#
1月19日 打卡day42
今日学习
介绍了几何学在前端领域里的应用, 同时用 vue3 带大家一起实现了常见图形的边界计算算法, 并且分享了如何用几何原理和Web Dom生成任意三角形的方式
1月19日 打卡day42
今日学习
介绍了几何学在前端领域里的应用, 同时用 vue3 带大家一起实现了常见图形的边界计算算法, 并且分享了如何用几何原理和Web Dom生成任意三角形的方式
展开
评论
点赞
#青训营笔记创作活动#
1月18日 打卡day41
今日学习
我们需要处理三件事情
收集验证
如果有三个相同的,那么就清除掉
清除掉以后,将后面的元素,全部移动上来
上面程序执行完毕后,判断收集盒中映射元素的数量
如果等于7 游戏结束输了
如果收集盒数量等于0,并且allBlock也已经没有元素了,就表示你赢了
1月18日 打卡day41
今日学习
我们需要处理三件事情
收集验证
如果有三个相同的,那么就清除掉
清除掉以后,将后面的元素,全部移动上来
上面程序执行完毕后,判断收集盒中映射元素的数量
如果等于7 游戏结束输了
如果收集盒数量等于0,并且allBlock也已经没有元素了,就表示你赢了
展开
评论
点赞
#青训营笔记创作活动#
1月17日 打卡day40
今日学习
用了 pixi.js 内置的过滤器类 DisplacementFilter ,它的作用是做贴图置换,做纹理偏移。
先实例化一个 DisplacementFilter 类,把纹理错位图传入进去,然后把这个过滤器实例添加到 filters 数组里面,最后执行 ticker 在 step 方法里会连续不断的执行, 通过不停改变 x 轴坐标,来实现纹理偏移水体扭曲的效果。
1月17日 打卡day40
今日学习
用了 pixi.js 内置的过滤器类 DisplacementFilter ,它的作用是做贴图置换,做纹理偏移。
先实例化一个 DisplacementFilter 类,把纹理错位图传入进去,然后把这个过滤器实例添加到 filters 数组里面,最后执行 ticker 在 step 方法里会连续不断的执行, 通过不停改变 x 轴坐标,来实现纹理偏移水体扭曲的效果。
展开
评论
点赞
#青训营笔记创作活动#
1月16日 打卡day39
今日学习
scroll-timeline 能够设定一个动画的开始和结束由滚动容器内的滚动进度决定,而不是由时间决定。
意思是,可以定义一个动画效果,该动画的开始和结束可以通过容器的滚动来进行控制。
使用传统的方法,那就必须得借助了 JavaScript 了,JavaScript 结合滚动的部分不是本文的重点,对于页面滚动配合动画时间轴,我们通常会使用 GSAP。
1月16日 打卡day39
今日学习
scroll-timeline 能够设定一个动画的开始和结束由滚动容器内的滚动进度决定,而不是由时间决定。
意思是,可以定义一个动画效果,该动画的开始和结束可以通过容器的滚动来进行控制。
使用传统的方法,那就必须得借助了 JavaScript 了,JavaScript 结合滚动的部分不是本文的重点,对于页面滚动配合动画时间轴,我们通常会使用 GSAP。
展开
评论
点赞
#青训营笔记创作活动#
1月15日 打卡day38
今日学习
React Hooks 作为 React 库的重要补充,它使函数组件能够以新的方式编写、重用和共享 React 代码。。
随着 Hooks 开始改变开发人员编写 React 组件的方式,需要编写一套 React Hooks 的最佳实践,以便团队内成员更轻松地开发和协作。
1月15日 打卡day38
今日学习
React Hooks 作为 React 库的重要补充,它使函数组件能够以新的方式编写、重用和共享 React 代码。。
随着 Hooks 开始改变开发人员编写 React 组件的方式,需要编写一套 React Hooks 的最佳实践,以便团队内成员更轻松地开发和协作。
展开
评论
点赞