【前端效率工具】:告别右键另存,不到 50 行代码一键批量下载网页图片
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
先看效果:在素材网站一键批量保存所有图片
废话不多说,直接上手!
项目结构
image-downloader-extension
├── manifest.json # 扩展的"身份证"
└── background.js # 插件后台脚本
创建文件夹 image-downloader-extension
创建manifest.jso ...
FFmpeg开发笔记(八十六)基于Node.js的国产视频编辑开源框架OpenCut
《FFmpeg开发实战:从零基础到短视频上线》一书的“第 12 章 FFmpeg的移动开发”介绍了如何使用FFmpeg在手机上剪辑视频,方便开发者更好地开发类似剪映那样的视频剪辑软件。那么在桌面系统上还有一款国产的开源视频编辑框架OpenCut,通过该框架可以更快地加工编辑视频文件,下面就来介绍如何在桌面系统中使用OpenCu ...
上传图片后图片加载失败,或因后台ftp传输共享目录延迟导致获取不到
在前端上传图片后,通过ajax传输至后台服务器,后台服务器通过ftp方式将文件发送至共享目录中,或因传输延迟或共享目录同步延迟导致前端无法获取到已上传的图片信息,这时需要对图片进行重新加载处理。
进行重新加载时需考虑加载次数以及加载时间,当图片加载失败时,通过重试机制重新加载图片。随加载次数递增,延长加载时 ...
别再说我不懂Node"流"了
Nodejs中包括4种类型的流:Readable、Writable、Duplex和Transform.
Readable Stream
自定义Readable
自定义 Readable 流必须调用 new stream.Readable([options]) 构造函数并实现 readable._read() 方法。
import { Readable } from "node:stream";
const readable = new Readable();
readable.on("data", (chunk) => ...
vivo 前端三剑客发展历程及原理揭秘
作者: vivo 互联网前端团队- Han Xuejian、Zhang Hao异地协作模式,给开发和测试间的问题沟通及定位带来了诸多挑战。本文从前端开发视角出发, 阐述在这过程中遇到的痛点,探索解决的思路,并在过程中成功孵化出技术工具“前端三剑客”,文章深入解析了“前端三剑客”技术的实现原理及应用场景。
1分钟看图掌握核心观点
& ...
CSS3 超实用属性:pointer-events (可穿透图层的鼠标事件)
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
CSS3 pointer-events 属性:实现可穿透图层的鼠标事件
在网页开发中,我们通常会遇到多个元素重叠的情况。在这种情况下,如何使得被遮挡的元素仍然能够响应鼠标事件呢?CSS3 引入了 pointer-events 属性,允许开发者控制元素是否能够接收鼠标事件。通过合 ...
Vue视差标题背景
一、说明
这个我是为了放在博客的标题部分作为背景图,上下滚动的时候比较好看。
原理就是通过几张透明的png进行叠加,然后在上下滚动时,外层png移动的快,内层png移动得慢来实现视差效果。
先放一张示意图:
这里实际的距离X和Y在观察者看来是一样的,原因是距离观察者的距离Z不一样导致的。
再放一张视差标题背景的3 ...
如果使用 vxe-table 实现全键盘操作,按键切换复选框单选框的选中状态
如果使用 vxe-table 实现全键盘操作,按键切换复选框单选框的选中状态,当遇到特点需求,比如需要通过按键来选中复选框或单选框时,该功能就非常有用了。
查看官网:https://vxetable.cn
gitbub:https://github.com/x-extends/vxe-table
gitee:https://gitee.com/x-extends/vxe-table
效果
代码
通过设置 keyboard-confi ...
解决用electron打包Vue工程(Vite)报错electron : Failed to load URL : xxx... with error : ERR _CONNECTION_REFUSED
解决用electron打包Vue工程(Vite)报错electron : Failed to load URL : xxx... with error : ERR _CONNECTION_REFUSED
Background: 生产环境通过 Electron 直接加载本地文件系统中的静态资源
注:node后的状态码不重要
明明前端工程可以运行,后端连接也没问题,为什么打包完成后总是连不上网址?
网上常规的排错思路:
• ...
给VitePress的右上角增加Github角标
介绍
我没有找到VitePress的Github角标的插件,所以做了后面的嵌入流程,方案是在主题布局中直接引入。如果不知道这两个项目的同学可以看看介绍部分
github-corner
可以在页面的四角显示Github角标,可以自定义大小、背景颜色。当鼠标移动到这个角标时还能看到Github摇尾巴的动画
官网地址: https://tholman.com/github-cor ...
Pixelium Design:Vue3 的像素风 UI 组件库
👾 Pixelium Design:Vue3 的像素风 UI 组件库
Pixelium Design 是一个基于 Vue 3 的像素风 UI 组件库。我们从早期像素游戏的经典美学中汲取灵感,为现代 Web 应用带来复古风格的界面和体验。该项目的初衷是为开发者提供一系列可复用、高效能的像素风组件,让项目中轻松实现独特的视觉风格。
如果你对这个项目感兴趣,欢迎 ...
宝藏工具站!一个轻量实用的在线工具集合!
大家好,我是 Java陈序员。
在日产生活中,常常需要各种小工具来解决日常遇到的问题,比如图片处理、文本转换、编程开发等。
快速搭建!一个轻量的在线工具箱!
8.7K+ Star!快速搭建个人在线工具箱
今天,给大家推荐一个集成了多种实用功能的轻量工具集合网站,无论是日常办公、学习还是娱乐,都能在这里找到合适的工具。
...
vue 下拉框 vxe-select 实现人员选择下拉列表
vue 下拉框 vxe-select 实现人员选择下拉列表
使用自定义选项插槽的方式,可以灵活的实现各种类型的下拉选择
官网:https://vxeui.com
github:https://github.com/x-extends/vxe-pc-ui
gitee:https://gitee.com/x-extends/vxe-pc-ui
需要注意当每一行高度超多默认高度时,必须要设置 option-config.height 来自定义选项 ...
Vue3+ElementPlus的BS端主从表的快速开发
在实际业务中,主从表的情况也是很常见的,如订单和订单明细,报价单和报价单明细,工艺和工艺路线,进货单和进货单明细等等,很常见的处理类型。
主从表一般涉及两个以上的表,一个是主表,其他的是从表的,在实际情况下,一般包含两个表较多,我们这里以两个表的主从表关系进行分析处理。本篇随笔介绍基于Vue3+ElementPlu ...
AG Grid推出全新MCP服务器——让AI更智能地理解你的数据表格!
作为全球领先的前端表格控件之一,AG Grid 再次引领创新。近日,AG Grid正式发布 AG MCP(Model Context Protocol Server) —— 一个基于开源协议的智能接口,旨在让各类AI模型(如Claude、Cursor、Copilot等)能够直接访问最新、最准确的AG Grid知识库。
AG Grid最新版试用,请联系AG Grid中国区合作伙伴 ...
记录---图文并茂讲解nginx中http升级https(部署SSL证书)知识点总结
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
为何网站要升级为https
原因有以下几点:
1. 避免浏览器的不安全的警告
浏览器对于http的网站会在地址栏明确标记【不安全】字样
这样直接降低用户对网站的信任度
造成用户流失
甚至可能被用户误认为是钓鱼网站
如下图,是笔者的网站没有升级https证书的时候的样子
升级后的
...
Web前端入门第 88 问:引入 JavaScript 的 script 标签究竟有多少用法?
HTML 版本不停的更新迭代,也导致浏览器支持的写法眼花缭乱,就拿 script 标签来说,刚刚入行的那会儿就只知道用来写内联的 js 代码,后来又学到了引入 js 文件,ES 模块规范化之后又知道能用来引入模块化的 js 代码,可这就是它的全部了吗??
然而...并不是!!!
各种用法
看看 script 千奇百怪的用法,一定有你没见过的 ...
兼容移动端!一款开源免费的中后台管理系统模版!
大家好,我是 Java陈序员。
你是否还在为搭建中后台管理系统从零开始编写代码而烦恼吗?
今天给大家推荐一款开源免费且功能强大的中后台管理系统模板,兼容移动端!
关注微信公众号:【Java陈序员】,获取开源项目分享、AI副业分享、超200本经典计算机电子书籍等。
项目介绍
vue-pure-admin —— 一款开源免费且开箱即用 ...
vxe-table 实现列头筛选自定义插槽模板,自定义输入框筛选数据
vxe-table 实现列头筛选自定义插槽模板,自定义输入框筛选数据
查看官网:https://vxetable.cn
gitbub:https://github.com/x-extends/vxe-table
gitee:https://gitee.com/x-extends/vxe-table
代码
通过自定义插槽模板 floatingFilter 实现,可以同时自定义弹出筛选面板和浮动筛选的自定义模板,非常灵活实现自定义组件
...
CSS - transition 粗浅记忆
在 CSS 中,transition 是用于实现元素样式平滑过渡的属性,能让元素从一种样式状态(如颜色、尺寸、位置等)逐渐变化到另一种状态,避免样式突变带来的生硬感。它是实现基础动画效果的核心工具,广泛用于 hover 交互、状态切换等场景。
一、transition 核心语法
transition 是一个复合属性,可以同时定义过渡的多个参数, ...