前端黑板报

浏览器跨页面通信 Broadcast Channel 与 window.postMessage 详解。...

如果有宽度，希望宽度不被伸缩，需要把 flex-shrink:0，不允许伸缩；如果是平分，元素被撑大，只需要设置 min-width:0...

最近一段时间在做 H5 聊天项目，踩过其中一大坑：输入框获取焦点，软键盘弹起，要求输入框吸附（或顶）在输入法框上。需求很明确，看似很简单，其实不然。从实验过一些机型上看，发...

微信小程序获取用户手机号码的教程，包括前端开发和后端开发，代码亲测可用，以及包括如何获取用户信息的最新方法...

跟着本文章节，一步一步操作（设置、插件、快捷键、技巧），以你自己的喜好修正，一定可以把 WebStorm 打造成你自己趁手的前端开发利器。入坑 WebStorm，看这一篇就...

最近，群里在讨论一个很有意思的线条动画效果，效果大致如下： 简单而言，就是线条沿着不规则路径的行进动画，其中的线条动画可以理解为是特殊的光效。 本文，我们将一起探索，看看在...

provide/inject这一对API，可以暴露出父组件的数据和方法供所有后代组件使用。vue2中provide/inject中如何传递响应式数据了？...

前段时间看到一个用纯CSS实现的手风琴效果，感觉比较有意思且实用，因此简单研究了一下代码，写篇短文记录下来。 实现原理代码不难，很容易能看懂。...

弹性布局(Flexible Box)，是由W3C提出的CSS布局的模型，提供了更加灵活高效的方式来布置、对齐和分配容器内项目的空间，特别是响应式和动态用户界面中，解决了传统...

你一定用过书签，也一定给你的书本加过书签，那么你见过书签式的导航吗？ 你一定见过手风琴，也一定知道弹奏手风琴时的它的外形变化，那么你见过手风琴式的导航吗？ 如果没有，请往下...

背景 最近在公司做需求遇到一个很有趣很常见的需求也是实现一个类似手风琴的css效果，当鼠标移动上时，展开，扩展高度，当鼠标移开手，收缩，高度为0。 这里也分享给大家，我的实...

如何将reactive和computed混合起来？这篇文章提供三种思路，分别是reactive+computed、reactive+getter以及reactive+thi...

最近在做一个在视频/图片上添加批注的需求，做了调研，最终选择svgjs作为基础工具实现批注功能，实现了框选批注和画笔批注。本文包含了批注功能完整实现细节，svg中插入vue...

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第2天，点击查看活动详情 在CSS中，我们常用border来表示一个元素的边框样式，也可以使用borde...

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第N天，点击查看活动详情 前言 嗯，在经过一系列复杂而又啰嗦的沟通之后，知道了他们的需求：Y轴必须有最...

这篇文章我来讲解下如何实现下面这样一个代码编辑器导出图片的工具。 应用地址：https://spacexcode.com/codeimage 介绍 要学好一门技术，最好的方...

博客已经两个月没有更新了，我去干啥了？这次不是偷懒，去搞了个大活！ 连续做了几款图片导出工具后，这次决定做一个复杂点的，覆盖场景更丰富点的图片美化工具。结合前面的经验，技术...