返回产品瞬间Motion Pack 27 · 工作流表面
支付结账
付款提交后，用处理中状态和收据结果缩短支付流程的不确定感。
•••• 4242
订单合计$48.00
实现一个支付结账：点击“支付 36 美元”后，按钮显示处理中，订单摘要保持可见；完成后切换为付款成功并展示订单编号。等待过程只使用短循环图标和状态文字，并提供减弱动效版本。
动效规则
成功结果包含金额、订单号和后续可查看的收据。
减弱动效
保留处理中和成功文字，省略旋转图标。
实现
HTML、CSS 与行为所需的 JavaScript 一起复制。