← 返回 Web 词条

浮动按钮菜单

Web需自己实现

Web 原生没有这个

网页没有原生的浮动按钮菜单,展开、焦点顺序和关闭行为都需要自行实现。

通常怎么做:用 button 与一组操作组合,打开后移动焦点,并支持遮罩或退出键关闭。

适用范围:桌面与移动端现代浏览器

社区一般叫它 Speed Dial · FAB Menu

它从一个浮动按钮展开少量相关操作,收起时只占一个按钮的位置。

  • 点右下角加号会散开几个按钮
  • 一个圆按钮展开一串小按钮
  • 角落按钮点开后让我选操作
  • 速拨菜单
  • 悬浮操作菜单
  • 浮动展开菜单

其他平台的相似实现

iOS需自己实现
该平台没有原生实现

苹果没有浮动按钮菜单组件,多个相关操作通常放入 Menu、工具栏或操作列表。

看 iOS 视角 →
Android原生支持
FAB Menu本平台没有对应叫法

这是 Material 3 Expressive 的新接口,通常与 ToggleFloatingActionButton 一起使用。

看 Android 视角 →

使用规范

什么时候用

  • 一个主要入口下面只有少量紧密相关的次级操作

什么时候别用

  • 操作很多、需要解释文字,或用户必须先比较多个选项

容易混淆

Web 出处

查看 Web / iOS / Android 完整对照 →