响应式测试互动盒 - 输入代码观看不同尺寸
粘贴HTML/CSS片段,拖动视口调整宽度,实时观察布局变化。
UD5工具箱
盯住彩色图形,倒计时结束后看向白墙,看到互补色残影
你盯的颜色与将在白墙上看到的后像颜色互为互补色:
粘贴HTML/CSS片段,拖动视口调整宽度,实时观察布局变化。
亲身体验三门问题,选择是否换门,统计大量实验下的中奖概率,验证反直觉结果。
在指定区域进行触摸操作,实时显示触摸点坐标和识别的基础手势(滑动、捏合等)。
将任意HTML元素全屏,监听进入/退出事件,并自定义全屏样式,理解全屏API细节。
记录每轮点数与得分,自动求和判定胜负,适配多种地方规则。
随机播放上行或下行旋律音程,在多个选项中选择正确度数,累计正确率。
添加玩家,输入每轮得分,实时显示总分和排名,适合游戏之夜。
控制角色跳跃与滑铲,躲避不断涌来的障碍物,挑战最长距离。
连接MIDI设备,实时显示音符编号、音名、力度及控制变化信息,调试音乐应用。
使用指针锁定 API 在 3D 场景中控制视角移动,模拟 FPS 游戏鼠标控制。
选择一个元素,展示浏览器如何根据 ARIA 属性、内容、label 等计算其可访问名称。
展示页面从active到frozen等状态切换事件,记录日志,帮助理解浏览器优化机制。
建立带压缩扩展的 WebSocket 连接,对比压缩前后消息大小。
使用 WebGPU 编写计算着色器执行矩阵乘法,对比 CPU 性能。
使用新的 Navigation API 拦截导航、管理历史条目,构建类 SPA 体验。
使用 NDEF 格式向 NFC 标签写入文本、URL 或自定义记录。
可视化展示发布/订阅模式的运作,添加订阅者和发布者,查看事件流。
创建 Shadow DOM 与普通 DOM 元素,对比样式隔离效果,理解 @layer 和 scoped styles。
模拟 Encrypted Media Extensions 流程,展示如何请求许可证并播放受保护视频。
构建嵌套元素,触发事件并逐步显示事件流经路径,可切换捕获/冒泡模式。
模拟古代斯巴达人将羊皮纸绕在棍上写信息的方法,输入文本解密。
收录多幅动态与静态视错觉,可调节参数观察效果,附科学解释。
3D地球展示地轴倾角与公转,调节月份直观理解太阳直射点移动如何形成四季。
上传一小块纹理样本,利用简单模板匹配算法无缝扩展填充成一张大图。
使用CTAP2模拟器或安全密钥在浏览器中体验无密码注册与认证流程。
选择各种数据类型演示structuredClone的深拷贝能力,对比JSON.parse的限制。
在主线程和Worker中分别计算大斐波那契数,对比界面的响应度。
显示渐小条纹,测试你能分辨的最小视角,对照理论视网膜细胞密度。
调节采样频率,观察对正弦波的离散采样和重建效果,演示欠采样导致的频率混叠。
显示当前已授予的权限,并提供方法引导用户手动撤销或重置浏览器权限。