Jelly UI:让 HTML 表单控件拥有软体物理

Jelly UI: Soft-body physics for native HTML form controls

厌倦了千篇一律的僵硬表单?Jelly UI 带来了一场触感革命。这是一个零依赖的 Web Components 库,将软体物理引擎完美融入原生 HTML 控件中。无论是按钮、滑块还是输入框,点击时都会像果冻一样产生真实的形变与回弹。它不仅支持暗色模式、RTL 布局,还内置了 WCAG AA 无障碍标准。只需引入一个脚本标签,就能让 40 种自定义组件在你的应用中活起来,为用户带来前所未有的触觉反馈体验。

真正的表单控件与软体物理相遇,打造出柔软且富有触感的用户界面。
  1. jlukic

    发现窗口有点卡顿,就深入查了一下原因。

    这个库每 8 毫秒对页面上的每个组件运行一次 RAF 动画循环,导致整个文档重绘。

    上面的那条评论看起来像是 AI 生成的:

    // 一个共享的动画帧:遍历每个活跃组件,空闲时暂停。

    // 限制 delta 值,防止后台标签页暂停后变成一次巨大的步进。

    "JellyEngine" 并没有只在指针事件上计算果冻动画,而是每帧重新计算页面上每个活跃组件。

    这种问题通常是人一眼就能看出来的,会说'别这么干,这太疯狂了'。

  2. TurkTurkleton

    很可爱(我是真心的,不是反讽),而且我很欣赏它似乎能优雅地降级处理 `@media (prefers-reduced-motion: reduce)`。不过对于演示网站来说,最好允许用户在不更改系统设置的情况下覆盖这一行为,或者至少提醒他们他们将看不到动画效果。

  3. orliesaurus

    如果我还年轻,我会很爱这个。但现在我大部分时间都在调整网站,用本地样式表把这类东西去掉……或者使用深色模式 + 阅读模式……真是时过境迁啊。

  4. itishappy

    我很喜欢这个,但它似乎不符合标准的 UX 最佳实践。

    如果我点击并拖拽鼠标到别处再松开,我认为元素不应该将其注册为点击。目前的表现不一致:按钮注册了点击,而复选框没有。

  5. jszymborski

    这条评论可能只有 HN 上的三个人会感兴趣,但还有人记得 Paul Neave 大概在 2007-2010 年左右有个网站/博客/展示页,页面边框有类似的果冻效果吗?那时候是用 Flash 实现的。

    Neave 那时是我的个人偶像……如果你能看到这条留言,希望你一切安好!

同日更多故事

2026-07-20