自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(137)
  • 资源 (2)
  • 收藏
  • 关注

原创 时间线 (步骤条)

在前端开发中,时间线(Timeline) 和 步骤条(Step Progress) 是常见的 UI 组件,常用于展示流程、历史事件或操作引导。⚠️ 注意:横向时间线的连接线是每个 .time2 自己画的“右边部分”,所以最后一个元素的线可能会超出容器。实际项目中可通过 :not(:last-child)::after 优化。💡 注意:.time::after 的 height: 100% 会延伸到每个 .time 元素的底部,从而形成连续的竖线。利用 伪元素 ::before 绘制圆形节点(时间点)

2026-01-13 16:59:16 684

原创 数字时钟翻页效果

结构设计:4 个卡片分工明确,上下层分离。CSS 3D:利用rotateX实现真实翻页。JS 控制:动态替换内容 + 巧妙触发动画。性能优化:仅在值变化时更新,避免无效渲染。这是一种典型的“用 2D DOM 模拟 3D 物理效果”的前端动画范例,既高效又视觉惊艳。

2026-01-09 15:58:08 1063

原创 dompurify 预防 xss攻击

【代码】dompurify 预防 xss攻击。

2026-01-08 14:22:46 99

原创 滑动方向检测器 js

【代码】滑动方向检测器 js。

2025-12-31 11:20:24 399

原创 横向滚动上方列表查看进度条变化

将横向滚动的“相对进度”(0% ~ 100%)线性映射到进度条在容器内的“绝对位置”。指示长内容的阅读/浏览进度UI 中的导航辅助(如故事流、商品轮播)增强用户对可滚动区域长度的感知。

2025-12-17 15:18:24 375

原创 自制 音频 拖拉组件

底部圆环是联动的进度。

2025-12-04 11:13:03 170

原创 cheerio 使用nodejs 下载 文档网站的图片

【代码】cheerio 使用nodejs 下载 文档网站的图片。

2025-12-04 08:45:30 169

原创 粒子 形成文字 效果 canvas

想象一下,我们要用很多小点(粒子)来"拼"出"123"这三个字。这就像用很多小星星拼出图案一样。这样就实现了用粒子组成文字的效果。

2025-12-02 10:31:32 338

原创 疯狂点赞效果 canvas

{

2025-12-01 14:19:39 303

原创 修改uniapp小程序rich-text里面图片样式

【代码】修改uniapp小程序rich-text里面图片样式。

2025-11-13 15:25:31 227

原创 uniapp主包使用子包的图片 真机会显示不出来

在uniapp中 主包的页面 中 如果使用了子包的图片 真机中会显示不出来。解决办法 就是把图片变成背景图 就可以正常显示。这个sub 就是子包 这里我引用了子包的图片。

2025-10-31 09:57:40 181

原创 uniapp 微信小程序 列表点击分享 不同的信息

【代码】uniapp 微信小程序 列表点击分享 不同的信息。

2025-07-29 18:02:02 459

原创 后台系统 tagView 实现

【代码】后台系统 tagView 实现。

2025-07-21 10:00:11 175

原创 微信小程序 上传 封装

【代码】微信小程序 上传 封装。

2025-07-21 09:14:49 257

原创 uniapp微信小程序--使用页面栈修改上一页的数据

点击后 获取到第一个页面的数据。返回第一页 数据已经改变。

2025-07-09 09:00:51 396

原创 自定义 radio 小程序

主要就是利用 label 点击 去激活 radio 隐藏原生的radio 只显示 自定义的图片 就可以做到自定义图片。

2025-07-03 17:48:53 121

原创 小程序 顶部栏标题栏 下拉滚动 渐显白色背景

在这里插入图片描述](https://i-blog.csdnimg.cn/direct/3164fd0e6d6848efaa1e87e02c35179e.png。这个主要就是’background-color: rgba(255, 255, 255, ‘+opacityVal+’)!important’pages中 当前的页面 取消顶部标题栏 就可以自定义标题栏。下拉 100px 后 变成渐变成白色。

2025-06-23 11:04:10 289

原创 flex-wrap: wrap 之后元素上下间距好大

原因:当元素设置了flex-wrap:wrap之后会有一个默认属性 align-content: stretch,元素被拉伸以适应容器。1.flex-wrap: wrap 之后元素上下间距好大,实际上没有设置间距。添加:align-content:flex-start 使元素位于容器的开头。

2025-06-12 15:54:24 278

原创 body Param Query 三个 不同的入参 分别是什么意思 在前端 要怎么传 这三种不同的参数

• 直接在 URL 路径中传递参数,适用于 GET/DELETE 等请求。• 发送 POST/PUT/PATCH 请求,将数据放在请求体中。掌握这些参数的使用方式,能够更灵活地处理不同场景下的数据传递需求。用于处理不同类型的请求参数。• 在 URL 后附加查询字符串,适用于 GET 请求。在 NestJS 中,

2025-04-27 17:54:38 540

原创 代码雨效果

​视觉增强:半透明覆盖实现拖尾、等宽字体保证对齐、随机颜色增强科技感。获取Canvas元素并设置高分屏适配(解决Retina屏模糊问题)​循环重置机制:到达底部后70%概率继续下落,30%概率重置。​坐标跟踪系统:nextChars数组记录每列当前下落深度。每帧用低透明度黑色矩形覆盖画布,产生渐隐拖尾效果。计算字符绘制位置(基于列索引和下落深度)判断是否到达底部(随机重置或继续下落)绿色系颜色建议(示例使用随机颜色)避免复杂图形操作(纯字符绘制)垂直坐标系基于字体大小动态计算。固定列宽布局减少计算量。

2025-03-24 17:19:10 229

原创 vue埋点

条件是否被监控说明浏览器环境使用 axios✅依赖 XMLHttpRequest使用 fetch 的 axios❌需取消注释 resetFetch()Node.js 环境❌无 XMLHttpRequest 对象当前代码中方法被注释,如需监控 fetch 请求需取消注释该方法。

2025-03-14 17:35:07 1273

原创 item 列表找到最后一排 不添加margin-bottom

【代码】item 列表找到最后一排 不添加margin-bottom。

2025-03-12 17:05:33 154

原创 拖动api

【代码】拖动api。

2025-03-06 18:15:50 169

原创 是否是长按按钮 判断

【代码】是否是长按按钮 判断。

2025-02-14 17:58:23 454

原创 Tab 如何滚动居中

【代码】Tab 如何滚动居中。

2025-01-15 17:50:26 196

原创 判断是否是全面屏

【代码】判断是否是全面屏。

2024-12-25 11:23:55 412

原创 vite打包 去掉 crossorigin

这是是 自己编写的vite 插件 plugins:[replaceCrossorigin()] 丢进这个就好了。

2024-12-04 18:01:34 574

原创 infinite-scroll-disabled设置为false 还是会触发v-infinite-scroll 这个滚动方法

解决办法 给父组件加上一个 最小高度 min-height :100vh 就可以解决这个问题。这里list 没有设置高度 父组件 也没有设置高度 就会导致这个 问题。

2024-12-02 18:16:00 424

原创 css设置宽高比

aspect-ratio: 4 / 3;

2024-11-21 15:06:00 216

原创 gsap 数字滚动 过度

【代码】gsap 数字滚动 过度。

2024-11-14 10:22:54 212

原创 如何做一个抽奖 转盘 设置概率

3.可以把奖品的每一项的等级和中奖概率 自己整合成数组 当抽到三等奖 比如三等奖有三个选项 分别是第三个 第五个和第八个。就可以在这三个内再随机选一个出来 乘以一份的角度 再减去一半的角度。2.概率可以用1到100的随机数 设置概率 例如1到60是三等奖 60到80是二等奖 80到95是一等奖 95到100是特等奖 概率可以自己设置100还是1000。1.可以把份数用360度 除以 多少个抽奖项 转到哪 就多加想要的那一项是第几个乘以 一份的角度 减去一半的角度 就刚好转到那个位置的中间。

2024-11-12 11:17:17 2744

原创 element tab栏 底部线条滑动到置顶位置 源码 修改简易版

【代码】tab栏 底部滑动。

2024-11-11 16:20:42 189

原创 js 如何判断是否是双击

【代码】js 如何判断是否是双击。

2024-11-08 16:04:38 294

原创 直播点赞效果

getRandom加载图像创建渲染函数:定义动画的各个属性(如缩放、位移、透明度等),并生成一个渲染函数。扫描并更新动画:在每一帧中更新动画状态并绘制图像。启动动画:创建新的渲染函数并添加到动画列表中,启动动画扫描。希望这些注释和解释能帮助你更好地理解这段代码!好的,让我们详细解释一下diffTime是如何产生的,以及它在整个动画过程中的作用。diffTimediffTime是通过计算当前时间与动画开始时间的差值,并将其归一化到 0 到 1 之间得到的。

2024-11-08 15:31:11 1093

原创 axios 发送 表单 application/x-www-form-urlencoded 用qs 序列化

这种的话 传过去 数组是 array 类型的 传过去的数据就不会有下标。在axios请求拦截器添加的就是。这样 的话 传过去的值就会是。在axios请求拦截器添加。

2024-10-30 15:20:43 372

原创 上传列表 对应上传进度

页面中一个上传文件的按钮 点击上传文件后会发起axios上传请求 同时会把这个文件的信息存在fileListing这个列表中,监听这个文件的上传进度 在页面中展示这个上传中的列表数据显示文件名和上传进度,上传完成后 进度隐藏 显示已上传完成要实现您描述的功能,我们需要使用前端技术来创建一个文件上传组件。这里我将提供一个基于Vue.js框架的示例代码,它使用了Axios库来处理文件上传请求,并在页面上动态显示文件的上传进度。

2024-10-29 16:38:50 521

原创 axios 取消请求 加上 控制并发 版本是1.7.5

从 v0.22.0 开始,Axios 支持 AbortController 以 fetch API 的方式取消请求。只有最后一个 能正常请求。

2024-10-29 15:18:31 607 2

原创 封装的axios 怎么获取 上传或者下载的进度

【代码】封装的axios 怎么获取 上传或者下载的进度。

2024-10-29 11:31:34 313

原创 vue2 自定义指令 列表元素上划 动画

【代码】vue2 自定义指令 列表元素上划 动画。

2024-10-25 15:06:08 302

原创 饿了么 ui表单 有滚动条的时候 右上角多一节

【代码】饿了么 ui表单 有滚动条的时候 右上角多一节。

2024-09-27 15:17:51 616

jdk-8u144-windows-x64.zip

JDK是 Java 语言的软件开发工具包,主要用于移动设备、嵌入式设备上的java应用程序。JDK是整个java开发的核心,它包含了JAVA的运行环境(JVM+Java系统类库)和JAVA工具。

2019-12-09

ssm框架goods.zip

SSM(Spring+SpringMVC+MyBatis)框架集由Spring、MyBatis两个开源框架整合而成(SpringMVC是Spring中的部分内容)。常作为数据源较简单的web项目的框架。

2019-12-09

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除