循序渐进，看看只使用 CSS ，可以鼓捣出什么样的充电动画效果。 欧了，勉强就是它了。有了电池，那接下来直接充电吧。最最简单的动画，那应该是用色彩把整个电池灌满即可。 有内味了，如果要求不高，这个勉强也就能够交差了。通过蓝色渐变表示电量，通过色块的位移动画实现充电的动画。但是总…

2019年6月6号，为了爱情，我离开工作了一年多的广州来到了杭州这个互联网城市。开始我的前端面试之旅... 放下拧螺丝的扳手，开始造起了飞机... 面试的第一家，一开始就问 Vue 双向绑定怎么实现。 在软件架构中，发布订阅是一种消息范式，消息的发送者（称为发布者）不会将消息直…

我们传统的前端更多的是用javascript实现各种复杂动画，自从有了Css3 transition和animation以来,前端开发在动画这一块有了更高的自由度和格局,对动画的开发也越来越容易。这篇文章就让我们汇总一下使用Css3实现的各种特效。这篇文章参考《css揭秘》这本…

说好的教程终于来了，第一篇文章主要来说一说在开始写实际业务代码之前的一些准备工作吧，但这里不会教你 webpack 的基础配置，热更新原理是什么，webpack速度优化等等，有需求的请自行 google，相关文章已经很多了。 如图可见模块有很多，而且随着业务的迭代，模块还会会越…

今天打开b站，看见一片灰色。对于公祭日，我们每一个人都应该为此默哀、纪念历史，都要铭记历史、热爱祖国、砥砺前行 首先，职业下意识就打开了控制台。为什么呢？是想看看怎么实现的，是css自定义属性吗？是引入一份css吗？是预处理器修改全局变量吗？结果，打开控制台，浏览了一下，最后定…

本章简要回顾我们到现在为止学到的 JavaScript 特性，并特别注意了一些细节。 这就是所谓的「自动分号插入」。但有时它不起作用，例如： 大多数代码风格指南都认为我们应该在每个语句后面都加上分号。 ……但即使我们在某处添加了「额外的」分号，这也不是错误。分号会被忽略的。 为…

有次看电影🎬， 看到屏幕上一个个的文字蹦出来， 感觉像是有人在打字一样， 觉得挺有意思， 于是这里也用js实现了一个。 通过setTimeout设置一个时间的间隔， 每隔一定时间向dom中插入对应的数据， 并将index加1， 然后重新调用这个写函数。 通过css3的anim…

网页布局，是前端入门的时候必学、必须熟练的一门技术，学到什么程度算是入门了呢？随便给你一个网站，你就可能快速的分析出网页的结构，然后搭建出模型，这是前端网页布局入门的最基本要求。 作为一个前端初学者，在学习的时候可能会用到一些盒模型传统的布局方式（display + posit…

在前端开发中不论CSS3也好，SVG也好，还是Canvas，无论多复杂的图形，都是由一个个点组成的。一个元素渲染后就可以得到一张位图，然后对这个位图上每一点进行变换，就可以得到新的一张位图，从而产生了视觉上的平移translate、旋转rotate、缩放scale、拉伸skew…