- 博客(57)
- 收藏
- 关注
RSS订阅原创 vite + vue 快速构建 html 页面 （舒适编写html文件）
本文介绍了使用Vite+Vue快速开发HTML模板的方法。首先需要安装Node.js、Vite、Vue和Prettier，然后安装vite-plugin-html-vue-ssr插件（支持源码修改）。通过配置vite.config.js文件即可使用该插件，文中提供了示例项目链接。同时推荐了Webpack5+Vue3的替代方案。整个流程简洁高效，适合快速构建静态页面项目。
2026-01-17 10:16:44
493
原创 javascript 加载 ifram 时自动计算高度，不显示滚动条、附带loading效果
该代码实现了一个动态加载和调整iframe尺寸的解决方案。loader.js脚本会监听页面中带有特定属性的script标签，自动创建包含加载动画的容器和iframe。当iframe内容加载完成后，通过postMessage通信机制向父页面发送尺寸信息，父页面收到后动态调整iframe大小并移除加载动画。iframe页面则持续监测内容高度变化，实时更新尺寸。整个方案实现了无缝的内容嵌入和自适应高度调整，同时提供了优雅的加载过渡效果。
2025-11-24 09:07:42
58
原创 javascript鼠标hover事件（防抖处理）
本文介绍了一个封装好的hover事件处理函数hoverEvent。该函数实现了防抖处理，可防止快速鼠标移动导致的事件频繁触发。函数接收三个参数：选择器selector、鼠标移入mouseenter和移出mouseleave的回调函数。使用时只需传入对应参数即可，如示例中为".hover-el"元素绑定hover事件。该封装简化了hover事件处理，并内置了100ms的防抖延迟，提升了交互体验。
2025-10-13 10:26:41
266
原创 iframe 全屏切换函数 Javascript 实现
这个代码片段实现了一个全屏切换功能。toggleFullScreen函数检查当前是否处于全屏状态，如果不是则让指定元素进入全屏模式，否则退出全屏。它兼容多种浏览器前缀（webkit、moz、ms）。示例中展示了如何调用该函数使一个iframe元素切换全屏状态。该函数提供了跨浏览器的全屏API统一封装，便于在网页中实现全屏功能。
2025-10-09 17:52:33
203
原创 用 javascript 实现一个通用分页构造器 “createPaginator“ ，内部自动维护 page 参数
本文介绍了如何实现一个通用的分页构造器createPaginator，并演示了其在分页加载场景中的应用。该构造器支持配置初始页码、前后置钩子函数和分页处理逻辑，通过next()方法控制分页状态。在示例中，结合scrollToBottom实现了滚动到底部自动加载更多数据的功能，同时处理了加载状态显示和数据请求逻辑。代码包含防抖机制、滚动兼容性处理和内存泄漏预防等细节，为前端分页功能提供了可复用的解决方案。
2025-09-23 15:31:42
850
原创 css 遮盖滚动条，鼠标移上显示
该HTML文档展示了一种使用CSS隐藏横向滚动条的技巧。通过::after伪元素和绝对定位，在PC端（宽度≥768px时）创建一个20px高的白色遮罩层覆盖滚动条区域。当鼠标悬停时遮罩消失，滚动条可见。这种方法保持了内容可横向滚动功能，同时实现了视觉上隐藏滚动条的UI效果。核心代码包括overflow-x-scroll类实现滚动，cover-scrollbar-x类实现遮盖逻辑，利用:has()选择器和hover状态控制遮罩显隐。
2025-09-05 16:45:14
414
原创 CSS 瀑布流图片简易实现
本文介绍了四种实现瀑布流布局的CSS方法：1) 使用float:left实现固定高度的常规浮动布局；2) 使用flex-wrap:wrap实现固定高度的弹性盒子布局；3) 使用column-count实现列数固定、宽高自适应的多列布局；4) 使用Grid布局结合grid-auto-flow:dense实现列数变化、宽高自适应的网格布局。每种方法都提供了对应的HTML结构和CSS样式代码示例，适用于不同需求场景下的瀑布流实现。
2025-09-04 16:20:11
1146
原创 Promise 极简实现，执行 resolve 就是执行了 then 传入的 callback
文章摘要：本文展示了一个简化版的 Promise 实现代码，核心逻辑包括构造函数、then 方法和 resolve 功能。通过 setTimeout 演示了异步操作如何触发 resolve，进而执行 then 方法中注册的回调函数。代码示例清晰地展现了 Promise 的基本工作机制：resolve 实际上就是执行 then 传入的回调函数。
2025-08-20 12:08:59
280
原创 Chrome 浏览使用 SwitchyOmega 扩展插件，替代 host 文件配置功能（以代理方式实现）
本文介绍了SwitchyOmega代理插件的安装与配置方法。首先通过图片展示插件安装界面，然后分两步详细说明配置过程：1）创建代理设置；2）建立自定义规则。最后指导用户如何启用配置好的规则。全文配有清晰的界面截图，帮助用户直观了解每个操作步骤。
2025-08-16 10:07:19
536
原创 js 实现洋葱模型、洋葱反向模型
摘要 本文通过JavaScript代码演示了两种中间件执行模式：正向链式调用和洋葱模型。第一种模式展示了函数按顺序调用但执行顺序反转的现象；第二种模式则实现了经典的洋葱模型，中间件按嵌套顺序依次执行，再逆序返回。代码示例清晰地展示了两种模式下函数调用的执行顺序差异，并通过控制台输出直观呈现了执行过程。文中配图展示了两种模式的具体执行结果，帮助理解中间件处理流程的特点。
2025-08-08 18:30:25
299
原创 JQuery 禁止页面滚动（防止页面抖动）
这段JavaScript代码提供了两个函数，用于控制页面的滚动行为。unScroll函数通过设置body元素的宽度和overflow-y属性为hidden，禁止页面上下滚动。reUnScroll函数则通过将overflow-y属性恢复为auto并移除宽度设置，重新启用页面滚动。这两个函数可以用于在特定场景下（如弹出层显示时）临时禁用页面滚动，以提升用户体验。
2025-05-19 17:16:54
331
原创 react native 实现 WebViewAutoHeight （兼容H5、已实际用于expo项目中）
用于替代 import AutoHeightWebView from “react-native-autoheight-webview”注意 react-native-autoheight-webview 加载内容动态变化时存在闪问题。
2025-04-29 17:33:55
65
原创 多行省略号 后加上自定义符号
通过比较文本的实际高度 (scrollHeight) 和容器的最大高度 (maxHeight) 来判断文本是否超出容器范围。如果文本被截断，则显示“查看更多”按钮；* 省略号显示自定义字符。/* 省略号自定义字符 *//* 两行省略号 */
2025-03-19 15:18:44
483
原创 expo5.2运行web报错Cannot find module ‘react‘
[SDK 52][router] Cannot find module 'react' error on Web when app config set to Server instead of Static
2024-11-14 17:59:02
521
原创 react、react-native 实现 tab 切换（实现缓存加载）
react、react-native 实现 tab 切换（实现缓存加载）
2024-10-14 16:20:44
823
原创 css3 用 background 实现斜切效果 linear-gradient 使用、clip-path 使用；
【代码】css3 用 background 实现斜切效果 linear-gradient 使用。
2024-05-28 17:04:14
709
原创 通过 itms-services 协议下载安装 IOS 应用
用 ssafari 浏览器通过 itms-services:// 协议下载安装 IOS 应用
2024-04-02 16:37:08
23191
2
原创 webpack5 + vue3快速开发html构建静态页面项目（快速开发html模板）
本文介绍了基于webpack搭建Vue项目的配置过程。首先通过npm初始化项目并安装webpack、webpack-cli、webpack-dev-server、html-webpack-plugin和vue等开发依赖。然后创建项目目录结构，包括HTML模板文件和自定义webpack插件（HotReload.js实现热更新、VueLoad.js处理Vue模板）。详细说明了webpack.config.js的配置方法，包含开发模式设置、入口输出配置、插件加载等。最后提到可通过copy-webpack-plug
2024-01-06 00:48:23
2371
3
原创 荣耀盒子M321（Hi3789mv100）刷机 linux -- TTL刷机
荣耀盒子M321（Hi3789mv100）刷机 linux -- TTL刷机
2023-12-29 17:31:32
20772
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人