建议结合源码一起阅读，效果更好（这个 DEMO 使用的是 Vue 技术栈）。 1. 编辑器 先来看一下页面的整体结构。 这一节要讲的编辑器其实就是中间的画布。它的作用是：当从左边组件列表拖拽出一个组件放到画布中时，画布要把这个组件渲染出来。 用一个数组 componentDat…

不知道有多少同学小时候玩过小霸王、GBA 之类游戏主机的模拟器呢？模拟器不仅仅是上面的游戏好玩，编写它的过程也是很有意思的。下面我们会介绍怎样拿 JavaScript 从头做一个带 CPU、内存、输入输出、能玩老游戏，体积还不到 3KB 的模拟器。 如果你觉得下面的理论有些枯燥…

就是顶部黄色的滚动进度条，随着页面的滚动进度而变化长短。 在继续阅读下文之前，你可以先缓一缓。尝试思考一下上面的效果或者动手尝试一下，不借助 JS ，能否巧妙的实现上述效果。 OK，继续。这个效果是我在业务开发的过程中遇到的一个类似的小问题。其实即便让我借助 Javascrip…

web是一个开放的平台，这也奠定了web从90年代初诞生直至今日将近30年来蓬勃的发展。然而，正所谓成也萧何败也萧何，开放的特性、搜索引擎以及简单易学的html、css技术使得web成为了互联网领域里最为流行和成熟的信息传播媒介；但如今作为商业化软件，web这个平台上的内容信息…

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

在月初的时候，发了CSS3热身实战--过渡与动画（实现炫酷下拉，手风琴，无缝滚动）。js的代码库也发过两次，两篇文章。之前也写了css3的热身实战，既然热身完了，是时候开始封装css3的代码库了，相比起js的代码库，css3的代码库的逻辑性就更加简单了！可以说只要打上注释和一张…

写在前面    最近看到一个非常酷炫的menu插件，一直想把它鼓捣成vue形式，谁让我是vue的死灰粉呢，如果这都不算爱😔。😆开个小玩耍，我们一起来探索黑魔法吧。观看本教程的读者需要具备一定的vue和

10 个独特的 CSS 背景视觉效果