JavaScript、CSS实现鼠标跟随繁花效果

2022-04-24
阅读 2 分钟
3k
我们监听mousemove事件,当事件触发时,创建一些 div,花朵,红心和气泡作为div的背景图片。并将他们的位置设置为鼠标指针的位置,然后使用settimeout在几秒钟之后将其删除后:

冷门又好用的 CSS 特性

2021-12-31
阅读 6 分钟
6k
CSS 提供了对多列布局的支持。支持设置布局中的列数 (column-count)、内容应如何列之间的流动规则、列之间的间距 (column-gap) 以及列分割线(column-rule)的样式。

Puppeteer 入门指引

2021-11-15
阅读 5 分钟
8.7k
Puppeteer 是一个 Node library,提供了一套完整的通过 DevTools 协议操纵 Chrome 或 Chromium 的 API。Puppeteer 默认以 无头(headless) 的方式运行, 也可以使用 GUI 的方式运行 Chrome 和 Chromium。

CSS实现渐变色边框(Gradient borders)的5种方法

2021-10-11
阅读 4 分钟
43k
CSS 提供了 border-image 属性用于给 border 绘制复杂图样,与 background-image 类似,我们可以在 border 中展示image和linear-gradient。

低代码开发平台构建实践 - Moria项目分享

2021-03-01
阅读 2 分钟
2.6k
项目取名为 Moria),原意为托尔金的小说中矮人在中土世界建立的庞大地下城市,包含巨大的坑道网络、屋室、矿坑及大殿。在此象征该平台可构建业务复杂的庞大应用(离目标还有点远)。
封面图

【学不动了系列】之 Deno 入门

2020-07-28
阅读 5 分钟
3.9k
希望大家不要被标题吓到,纯属为了吸引眼球😢。。根据笔者这两天的学习感受,Deno 比 Node 更容易入门,如果你有 Node 的基础那更简单了,很多东西都是可以类比的,学起来豪不费力。个人认为现在正是入门 Deno 的最好时机,随着 v1.0 的发布 Deno 的 API 已趋于稳定,但整个生态圈的繁荣才刚刚开始,所以趁 Deno 还是个宝...

那些年遇到的刁钻JavaScript面试题(可防踩坑)

2020-07-23
阅读 7 分钟
5.1k
解析:这是比较常规的面试题了,主要考察的是 JavaScript 中的隐式类型转换。在 JS 中 + 主要有两个作用:数字相加和字符串拼接,当 + 两边不都为数字时会把它们都转为字符串再拼接,所以第一个 2 会先被转成 '2' 再与第二个 '2' 拼接。

前端小技巧:变形汉堡按钮(Hamburger Menu)

2020-07-07
阅读 3 分钟
5.7k
汉堡按钮(Hamburger menu)常用于移动端网站 展开/收起 导航,如果在点击按钮时再增加一些过渡动画则会显得更加生动有趣。今天我们就快速实现一个带有过渡动画的汉堡按钮。效果如图:

前端小技巧:纯CSS实现瀑布流(Masonry)

2020-07-06
阅读 3 分钟
5.6k
瀑布流提供了一种错落有致的美观布局,被各种注重交互品味的素材网站(如:花瓣、unsplash)广泛应用。社区也提供了不少瀑布流布局的工具,如:masonry 、colcade 等。常规的实现瀑布流的做法是用 JS 动态的计算“砖块”的尺寸和位置,计算量大、性能差。今天给大家介绍一种使用纯 CSS 实现瀑布流的方法,简洁优雅。主要使...

前端小技巧:实现自定义右键菜单(Context Menu)

2020-07-05
阅读 3 分钟
10.6k
鼠标右击网页会弹出默认的浏览器菜单,但是很多时候我们需要自定义右键菜单(比如:在线文档编辑器、定制视频播放器等)。今天我们就来快速实现一个自定义右键菜单。

前端需要了解的9种设计模式

2020-04-16
阅读 12 分钟
5.5k
设计模式是对软件设计开发过程中反复出现的某类问题的通用解决方案。设计模式更多的是指导思想和方法论,而不是现成的代码,当然每种设计模式都有每种语言中的具体实现方式。学习设计模式更多的是理解各种模式的内在思想和解决的问题,毕竟这是前人无数经验总结成的最佳实践,而代码实现则是对加深理解的辅助。

七个你没用过的炫酷开发工具推荐

2019-02-13
阅读 2 分钟
7.2k
本文翻译整理自youtube 7 Amazing Developer Tools that you're not using yet 1. BundlePhobia BundlePhobia用于分析npm package的依赖、bundle后的大小、下载速度预估等等,帮助你在引用一个package之前了解引入该package的代价: 你也可以将项目的package.json文件上传,BundlePhobia会帮你评估项目中所有包的大小和...

2019 简易Web开发指南

2018-12-26
阅读 3 分钟
10.1k
2019年即将到来,各位同学2018年辛苦了。 不管大家2018年过的怎么样,2019年还是要继续加油的! 在此我整理了个人认为在2019仍是或者将成为主流的技术与大家分享,包括前端、后端和全栈相关。