屏幕唤醒锁测试器 - 保持常亮应用演示
请求Screen Wake Lock防止屏幕关闭,监听释放事件,适用于观看长内容等场景。
UD5工具箱
屏幕可以正常变暗或关闭
视频播放、导航指引、演示文稿、烹饪食谱、阅读长文、代码演示等需要屏幕保持常亮的场景。
需要 HTTPS 环境,必须由用户手势触发。页面隐藏时系统会自动释放锁以节省电量。
暂无日志,点击按钮开始测试
navigator.wakeLock.request('screen') 方法请求一个唤醒锁,返回一个 WakeLockSentinel 对象。当不再需要时,可以调用 sentinel.release() 手动释放。该 API 特别适用于视频播放器、导航应用、在线演示等场景。
| 浏览器 | 支持版本 | 状态 |
|---|---|---|
| Chrome | 84+ | 完全支持 |
| Edge | 84+ | 完全支持 |
| Opera | 70+ | 完全支持 |
| Chrome Android | 84+ | 完全支持 |
| Samsung Internet | 14+ | 完全支持 |
| Firefox | - | 不支持 |
| Safari / iOS Safari | - | 不支持 |
visibilitychange 事件,在页面恢复可见时重新请求唤醒锁(本工具提供"自动重新锁定"选项)。
navigator.wakeLock 将为 undefined。这是为了保护用户免受恶意网站滥用(如阻止屏幕关闭来耗尽电池)。
if ('wakeLock' in navigator) { /* 支持 */ }if (navigator.wakeLock && typeof navigator.wakeLock.request === 'function') { /* 可用 */ }request(),浏览器会拒绝请求并抛出错误。不过,在 visibilitychange 事件中重新请求唤醒锁是被允许的,因为这被视为对初始用户手势的延续。
request(),处理可能的异常。请求Screen Wake Lock防止屏幕关闭,监听释放事件,适用于观看长内容等场景。
请求浏览器保持屏幕唤醒,防止自动锁屏,显示当前唤醒锁状态。
将屏幕变为纯白色或指定颜色,最高亮度辅助照明或信号。
生成半透明暖色或冷色遮罩层叠加在页面上,模拟护眼模式或色温调节。
显示当前屏幕方向,并尝试锁定为横屏或竖屏模式,仅部分浏览器支持。
在网页顶部添加半透明暖色或暗色覆盖层,调节不透明度,降低屏幕刺眼感。
设计振动时长与停顿数组,点击试振,复制代码在移动端触发自定义触感反馈。
连接游戏手柄,触发不同时长和强度的振动效果,测试Vibration Actuator API。
支持任意格式颜色输入,计算对比度并显示WCAG 2.1各级别通过情况,含颜色建议。
拖拉RGB三个滑块混合颜色,模拟硬件调色体验,显示16进制及色温感觉。
展示几组在各类色盲下仍可区分的定性数据配色方案,含Hex码。
基于屏幕物理尺寸校准后显示标准对数视力表,粗测裸眼视力。
拖放 lcov.info 文件,以颜色标示每行代码的覆盖状态。
可拖拽的虚拟尺子和量角器叠于当前页面,精确测量像素长度与旋转角度。
演示如何拦截PWA安装事件并自定义安装按钮,查看浏览器原生安装提示效果。
通过Web MIDI API连接键盘,实时显示收到的音符开/关与控制器变化。
加载两段节奏循环,用鼠标在虚拟唱片上移动模拟黑胶搓碟效果。
标准检查项清单,启动前逐项打勾,养成良好驾驶习惯。
添加任务步骤并分配时间,构建理想的早晚程序清单,播放模式自动计时切换。
选择或输入多个开源许可证,查看它们组合在闭源或开源项目中的兼容性矩阵与义务。
设定目标时长,全屏显示绿→黄→红进度条,辅助控制演讲节奏与时间管理。
绑定动画进度到滚动位置,交互式调整参数,直观理解scroll-timeline和view-timeline。
模拟经典玩具,按方向键或虚拟旋钮绘制线条,按空格键晃动清除。
记录上床、睡着、醒来时间,评分并记梦,长期追踪寻改善。
自定义箭头方向、颜色、大小和动画,生成无需JavaScript的纯CSS tooltip组件代码。
拖拽滑块调整背景模糊度、透明度与边框发光,实时预览毛玻璃面板并复制CSS代码。
为照片四周添加纯色或渐变暗角,调整强度与羽化程度,营造复古或突出中心效果。
编写带有伪类的选择器,实时高亮匹配的HTML元素,探索现代CSS选择器的能力。
在绘图板画几条直线,算法自动利用霍夫变换检测并高亮出这些线段。
分别使用主线程Canvas和OffscreenCanvas在Worker中渲染动画,对比FPS和流畅度。