制作动画“添加到购物车”按钮摇动效果

为什么要让按钮有动画？

为“添加到购物车”按钮添加动画是一种吸引注意力的有效方法，可确保您的号召性用语 (CTA) 在页面上脱颖而出。此技术可以 提高用户参与度 金益辉 提高点击率，使得用户更有可能采取所需的操作。

最有效和最常用的动画之一是“摇动”效果，它为按钮添加了动态运动，使用户很难错过。

看看这个例子：

使用 GemPages 制作动画“添加到购物车”按钮摇动效果

在 GemPages 中为按钮创建摇动动画非常简单且可自定义。请按照以下步骤实现和微调效果：

步骤 1：在按钮设置中启用动画

进入 GemPages 编辑器后，选择 添加到购物车 按钮打开页面上的设置。

在左侧边栏中，转到 先进的 标签。向下滚动到 动画 选项并将其打开。

步骤 2：应用摇动动画

点击 摇 动画选项的效果。您可以根据需要将按钮设置为仅在悬停时摇动，或设置为在出现时摇动。

然后，调整 动画设置 控制摇动效果的表现方式。

• 强度： 定义摇晃动作的强度。
• 速度： 设置摇动效果发生的速度。 
• 延迟： 指定动画开始前的延迟（以秒为单位）。
• 宽松： 选择动画随时间如何进展：
  • 线性： 始终保持恒定速度。
  • 缓入： 开始时缓慢，然后逐渐加快。
  • 缓出： 开始时很快，然后慢慢变慢。
  • 缓入缓出： 慢启动和慢结束的组合。
• 循环： 决定摇动动画是否应连续重复或仅发生一次。

要了解更多有关 动画设置， 你可以阅读 本文.

步骤 3：保存并发布

在顶部栏中，保存更新并点击 发布 使您的更改在店面上生效。