1. 使用 <img> 标签的方法 HTML: CSS: .image-container 设置了宽度为 100%，这意味着它会根据父元素的宽度自适应。padding-top 的值计算了宽高比，这里是

前言 在现代网页应用中，拖拽功能已经成为提升用户体验的重要手段之一。尤其是对于图片管理、相册编辑、文件上传等场景，拖拽功能可以极大地简化操作流程，提高用户满意度。本文将详细介绍如何在网页中实现图片拖拽

canvas svg描边动画 弧形选项卡 瀑布流 钉钉动画 鼠标移动的高亮边框 头像超出边框 透明盒子的渐变阴影 3D倾斜 锯齿菱形边缘 9宫格 轮播 上下视差滚动 文字交融展开 下划线动画 菜单过渡

前言 几乎所有的文章，都存在目录和内容区，而且在阅读文章向下滑动的时候，目录也会做出联动，点击目录的时候，也会跳到内容区的响应位置。对于这一功能，我实在比较好奇，因为这种技术不单单只在文章类中用到，比

我们经常会在博客、文档中看到类似这样的侧边导航目录，例如 这种导航也被称为“电梯导航”（当然可能还有其他叫法，知道是这个交互就行）。它会随着内容的滚动而自动切换当前选中态，点击任意目录也会自动滚动到对

利用原生canvas实现图形标注功能 由于工作需要，项目中要求实现一个功能—在视频或者图片上进行图形标注，支持矩形、多边形、线段、圆形、折线，已绘制的图形可以进行缩放，移动。 完整功能源代码在这个仓库

在熟悉业务中播放器功能的时候，发现时间轴上绑定了点击和拖动事件，频繁遇到了类似pageX之类的事件属性。往往在需要动态计算元素的高度或者事件发生位置时需要用到此类属性，之前的学习中没有系统性地进行过归纳总结。现从最基本的鼠标事件的属性开始，完整的梳理一下各个属性的区别以便日后查…

前段时间，一不小心发力过猛就改造了一款vscode插件。 起因 在搭建前端架构的过程中，大家都会在项目的入口文件中导入全局样式，进行样式统一，如果有其他个别特殊样式，我们会在单个组件中处理。 然而，麻

🌐 原地址 👉 h3 🫰 demo 🫰 🧐 思路分析 🧐 这样看是不是一目了然呢~ 😏 如上👆gif👆效果可以理解为👉 以鼠标位置为圆心，产生的背景圆，与box的间隙产生的交叉 ❓ 这么实现会不会有问