ZH
PortuguêsEnglishEspañolDeutschFrançaisItaliano日本語Русский中文
首页 收藏
Voltar

返回顶部按钮

选择位置、颜色以及滚动多少后出现。滚动预览即可看到按钮出现。

使用方法

返回顶部按钮


可用语言: PortuguêsEspañolEnglishDeutschFrançaisItaliano日本語Русский中文

下一个工具网站分享按钮→
广告

返回顶部按钮: 用途

在很长的页面上,返回顶部按钮让人不必滚回去,在手机上尤其方便。

选择位置、颜色、大小、形状、距离边缘的间距,以及滚动多少后出现。代码使用真正的带标签的按钮,以简短过渡出现,只对没有要求减少动态效果的用户平滑滚动,不让隐藏的按钮获得焦点,并把焦点移到页面开头。

使用方法

  1. 选择位置、颜色和大小。
  2. 设置距离和出现时机。
  3. 复制代码并粘贴到 body 结束之前。

使用场景

  • 博客和长文章。
  • 商品列表很长的商店。
  • 菜单和目录。

常见问题

按钮什么时候出现?

当用户把页面滚动超过你选择的高度之后(默认是一屏)。在很短的页面上它永远不会出现,避免在内容上方放一个无用的按钮。

会和 WhatsApp 按钮冲突吗?

可能会在同一个角落。请把返回顶部放在另一侧,或增大距离底部的间距,避免在手机上互相遮挡。

为什么焦点会回到顶部?

使用键盘或读屏软件浏览的人在点击按钮后,应该从页面开头继续浏览。代码在滚动屏幕的同时,会把焦点移到第一个元素。

真的免费吗?

是的,100%免费。无需注册,无需订阅,不限使用次数。所有工具:Tools123是免费的。

相似工具

非常感谢您的支持!

每一笔捐赠都有助于维持网站运行。这些工具旨在帮助您,但我们有服务器开销。如果您愿意支持,将不胜感激!请选择或输入金额:

通过Stripe安全支付。将在新标签页打开。

工具按现状提供,不作任何保证。我们不对结果及其使用承担责任。