独立产品一款 React 导航栏菜单组件,支持⌨️全键盘和♿️屏幕阅读器访问,具有流畅的动画

头像
wsWmsw
51阅读0评论

电友们好,来分享个我最近写的组件,有需要的电友请享用~

一个导航栏菜单组件,navbar-153。这个组件主打动画流畅和出色的可访问性,可访问性分为键盘导航和屏幕阅读器导航,在这个组件里,可以完全由键盘控制,使用起来很原生。另外组件也支持屏幕阅读器导航,感兴趣的电友可以打开苹果的旁白或者安卓的 TalkBack 摸一摸试试。

这个组件还有个特点,允许关闭动画选项,有了这个选项,就可以识别用户的操作系统的设置,可以识别(苹果)用户是否打开了“减弱动态效果”,按照设定打开或关闭动画。技术上,单独为无动画的效果做了实现,这样做对逻辑组织和渲染性能有好处。

欢迎访问文档和项目主页,项目主页用 Next.js 项目,用了 Next.js 的国际化功能,感兴趣的可以查看项目路径 examples/demo-nextjs。个人觉得这个主页做的简约不失格调,欢迎大家访问~

navbar-153 特性:

  • 🍯 流畅的过渡动画;
  • ⌨️ 键盘导航;
  • ♿️ 屏幕阅读器导航;
  • 🎨 高度自定义。

仓库:https://github.com/wswmsword/navbar-153

主页:https://wswmsword.github.io/examples/navbar-153

收藏
举报
加载中…
精选评论
暂无数据
暂无数据