屏幕唤醒锁测试器 - 保持常亮应用演示
请求Screen Wake Lock防止屏幕关闭,监听释放事件,适用于观看长内容等场景。
UD5工具箱
Wake Lock API 演示 · 防止屏幕自动关闭或休眠
navigator.wakeLock.request('screen') 方法调用,返回一个 WakeLockSentinel 对象用于管理和释放唤醒锁。
visibilityState 变为 hidden),此时操作系统或浏览器可能会自动释放唤醒锁以优化电源管理。本工具会监听页面可见性变化,在您返回页面时自动尝试重新获取唤醒锁。如果自动恢复失败,您只需再次点击按钮即可。
'system' 类型用于防止 CPU 进入深度休眠(适用于后台任务)。此外,浏览器可能会提供更细粒度的电量管理策略和用户权限控制。随着 Progressive Web Apps (PWA) 的普及,Wake Lock API 将成为提升用户体验的关键能力之一。
请求Screen Wake Lock防止屏幕关闭,监听释放事件,适用于观看长内容等场景。
请求和释放屏幕唤醒锁,并监听释放事件,适用于视频播放或演示场景。
将屏幕变为纯白色或指定颜色,最高亮度辅助照明或信号。
演示如何拦截PWA安装事件并自定义安装按钮,查看浏览器原生安装提示效果。
支持任意格式颜色输入,计算对比度并显示WCAG 2.1各级别通过情况,含颜色建议。
拖拉RGB三个滑块混合颜色,模拟硬件调色体验,显示16进制及色温感觉。
显示当前屏幕方向,并尝试锁定为横屏或竖屏模式,仅部分浏览器支持。
连接游戏手柄,分别控制左右握把的振动马达强度和时间,测试振动效果。
设计振动时长与停顿数组,点击试振,复制代码在移动端触发自定义触感反馈。
使用三个滑块精细调整 HSL 各分量,实时预览颜色并复制十六进制或 RGB。
连接游戏手柄,触发不同时长和强度的振动效果,测试Vibration Actuator API。
模拟经典玩具,按方向键或虚拟旋钮绘制线条,按空格键晃动清除。
自定义箭头方向、颜色、大小和动画,生成无需JavaScript的纯CSS tooltip组件代码。
根据电源电压、LED正向电压和电流,计算所需串联限流电阻的阻值和功率。
输入目标阻值,从标准E系列阻值中找出最接近的两个并联电阻组合。
在开发环境中模拟 periodicSync 事件,触发后查看 SW 中的处理逻辑和网络请求。
拖拽滑块调整背景模糊度、透明度与边框发光,实时预览毛玻璃面板并复制CSS代码。
生成半透明暖色或冷色遮罩层叠加在页面上,模拟护眼模式或色温调节。
编写 Lit 组件模板和属性,实时渲染并观察响应式更新,无需构建环境。
解析 Svelte 组件的反应式声明,绘制变量之间的依赖关系链,便于理解更新逻辑。
选择触发位置、箭头方向与样式,生成轻量悬停提示框代码。
选择或输入多个开源许可证,查看它们组合在闭源或开源项目中的兼容性矩阵与义务。
输入Markdown风格要点列表,全屏展示时逐步放大当前项,类似非线性的展示。
拖拽与门、或门、非门等构建组合逻辑电路,输入高/低电平观察输出。
标准检查项清单,启动前逐项打勾,养成良好驾驶习惯。
编写正则表达式,在文本中用不同颜色高亮整个匹配和每个捕获组。
编写Brainfuck代码,以可视化的方式步进执行,观察活动纸带和指针。
输入电源电压和LED串并配置,为每组LED计算所需的限流电阻值。
分别使用主线程Canvas和OffscreenCanvas在Worker中渲染动画,对比FPS和流畅度。
在网页顶部添加半透明暖色或暗色覆盖层,调节不透明度,降低屏幕刺眼感。