摘要: 本文简介 点赞 + 关注 + 收藏 = 学会了 在 JS 中,伪数组 是非常常见的,它也叫 类数组。伪数组可能会给 JS 初学者带来一点困扰。 本文将详细讲解 什么是伪数组,以及分别在 ES5 和 ES6 中将伪数组转换成真正的数组 。 什么是伪数组? 伪数组的主要特征:它是一个对象,并且该对象有 阅读全文
posted @ 2022-07-04 23:01 德育处主任 阅读(224) 评论(0) 推荐(0)
摘要: 🎈前言 点赞 + 收藏 = 学会了 🐱‍💻在线展示 🐱‍👓代码仓库 先看看最终效果 这个效果非常简单,只要看完实现原理应该就是有思路了。 🎗️原理 规定好容器尺寸 设置渐变背景: background: linear-gradient(...) 自己设置角度和颜色吧 设置背景尺寸比容器大 阅读全文
posted @ 2022-07-04 17:16 德育处主任 阅读(1261) 评论(0) 推荐(0)
摘要: 持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第23天,点击查看活动详情 本文简介 点赞 + 关注 + 收藏 = 学会了 在我年轻时做过的开发中,毛玻璃应用得最广是在复杂的背景图上。 如果你希望在一个复杂的背景上添加文字,文字能清晰展示,并尽可能的保留原背景的话,使用毛玻璃的效 阅读全文
posted @ 2022-07-04 08:57 德育处主任 阅读(1501) 评论(0) 推荐(0)
摘要: 本文简介 我列举了3种在 Fabric.js 中 更换图片 的方法。 其中还包括 更换组内图片 的操作。 环境和版本 Chrome浏览器版本:96.0.4664.45 Fabric.js版本:4.6.0 我是在原生环境下开发的,同时也提供了一份 Vue3 环境下开发的代码(文末有链接)。 动手操作 阅读全文
posted @ 2022-07-03 06:55 德育处主任 阅读(895) 评论(0) 推荐(0)
摘要: 本文简介 使用 Fabric.js 创建画布时,可以在参数里配置画布的宽高。 除了初始化时设置之外,Fabric.js 还提供了其他 api 供后期修改画布宽高。 本文列举了 Fabric.js 的3个 api 设置画布宽高。 这3个 api 虽然简单,但在实际开发中可能很重要。比如监听浏览器窗口缩 阅读全文
posted @ 2022-07-02 09:18 德育处主任 阅读(674) 评论(0) 推荐(1)
摘要: 效果展示 思路分析 层级思路 从展示的效果可以猜到这个效果由3层文字组成。 表面一层黑色文字 中间一层白色文字 最低的一层是斑马条纹文字 要实现多层文字,我首先想到的是文字投影 text-shadow ,但通常 text-shadow 只能投个纯色出来。 于是思路要改一下,黑色和白色层是投影,斑马条 阅读全文
posted @ 2022-07-01 12:25 德育处主任 阅读(155) 评论(0) 推荐(0)
摘要: 本文介绍 点赞就等于学会了! 如果本文对您有帮助,建议点赞收藏(点赞就等于学会了) Skeleton 源码一共只有 419 行(加上注释和换行),非常适合用来学习。 本文是根据我的学习过程来编写的,几乎每个章节都包含 使用方法 和 源码分析。 虽然现在大部分业务都不需要重复造轮子了,但对于小白来说, 阅读全文
posted @ 2022-06-30 08:05 德育处主任 阅读(90) 评论(0) 推荐(0)
摘要: 前言 本文主要讲前端开发时遇到的 编码规范难以落地的问题 以及 解决方案 ,包括 编码规范 和 git commit 规范。 重点在 落实前端团队编码规范 的操作上。跟着我一步一步去做,一定可以将规范落地。 问:要不要制定编码规范?要不要使用 ESLint ?要不要规范化 git 的提交 ? 答:非 阅读全文
posted @ 2022-06-25 13:54 德育处主任 阅读(138) 评论(0) 推荐(0)
摘要: 本文简介 Fabric.js 默认没提供 鼠标右键事件,只有 鼠标按键点击 、鼠标按键抬起 、鼠标移动 等事件。 但在工作中有可能需要用到 “右键” 事件,比如 “右键菜单” 。所以就有了本文。 本文主要关注 Fabric.js 的主要 api 有: fireRightClick:允许右键点击 st 阅读全文
posted @ 2022-06-25 13:54 德育处主任 阅读(498) 评论(0) 推荐(0)
摘要: 本文介绍 我使用 Fabric.js 的版本是 4.6.0。 这次要实现的效果是:在本地上传一张图片,然后渲染到 canvas 里(当做背景图)。 我会用 原生 的方法实现一次,然后再在 Vue3 + Element-plus 环境下实现一次。 最后聊聊我在真实项目中的做法。 需求: 通过点击上传按 阅读全文
posted @ 2022-06-25 13:53 德育处主任 阅读(668) 评论(0) 推荐(0)