的确，有些标题党了。起因是微信群里，有哥们问我，你是怎么学习前端的呢？能不能共享一下学习方法。一句话也挺触动我的，我真的不算是什么大佬，对于学习前端知识，我也不能说是掌握了什么捷径。当然，我个人的学习方法这篇文章已经在写了，预计这周末会在我个人公众号发布。而在此之前，我想展(g…

之前用饿了么印象最深刻的是联动菜单和小球飞入购物车动画，所以想看看别人是怎么实现的，但是看了很多仿饿了么的demo都是实现了一个完整的大的项目，要找到那个小模块很麻烦，所以自己将联动菜单和动画提取出来写了一个demo，方便学习。 1. 联动菜单 该元素定位表现为在跨越特定阈值前…

最近，群友分享了一个很有意思的效果： 原效果的网址：frosted-glass。该效果的几个核心点： 毛玻璃磨砂效果 卡片的 3D 旋转跟随效果 整体透明度和磨砂感、以及卡片的 3D 形态会随着用户移

使用 CSS 实现亚克力效果（Acrylic Material），Mac OS的磨砂玻璃效果（Frosted Glass）和 玻璃变形（Glassmorphism)等 UI 效果！

概述 在前端开发中，经常会碰到这种磨砂玻璃效果，其实这个效果很简单，一个CSS属性就能搞定 基础代码结构 基础代码结构就不展示了，就一个背景、文字、div覆盖层，我们主要看div覆盖层的CSS样式

动画实际上就是一个视觉欺骗功能，一个前端如果不会视觉欺骗，那么针对很多效果将会手无足措，实际上学习动画的过程中，也能更好理解视觉欺骗，实际开发一些场景也会有更多实现方案

IntersectionObserver使我们能够轻松获取获取元素的交叉状态，实现诸如懒加载、埋点监控、视差滚动等多种场景。 它性能良好，用法简洁。带来了极大的便利和用户体验，非常值得尝试。

canvas简单易上手，在图形、可视化、视频等多个领域有出色表现，是前端开发者扩展技术栈的不二之选。 希望你能通过本文学到Canvas基本的用法和场景，有所收获😊

背景 这期并不是什么高大上的主题，但是对于支付业务却是尤为重要，那就是如何在前端角度防止重复支付，在这边把我的解决方案记录下来，也想剖析一下里面的细节，同时也分享给大家。 解决方案 一、先理清整体逻辑