回到所有的课程
课程库

转换

平滑动画之间的状态与过渡

这个视频的特点是一个旧的UI。更新版本即将发布!

过渡帮助创建一个流畅的动画之间的不同的一个元素。可以自定义持续时间和缓和类型,以创建独特的过渡。一个常见的用例是为元素的悬停状态创建平滑过渡,这样它们就不会在悬停时突然改变。

在这节课中:

  1. 样式按钮的悬停状态
  2. 设置一个过渡平滑动画悬停

样式按钮的悬停状态

  1. 选择一个按钮
  2. 添加一个盒阴影把它做成你想要的样子
  3. 徘徊状态
  4. 增加阴影的强度和距离
  5. 切换回没有一个状态

设置一个过渡平滑动画悬停

  1. 添加一个过渡并选择盒阴影从属性下拉菜单中
  2. 增加500ms的持续时间
  3. 保持宽松政策不变
  4. 现在,悬停在按钮上,你可以看到阴影的强度和距离平滑过渡
第一步在左边,单击过渡效果行中的加号图标。在右边的第二步,从属性下拉菜单中的背景部分选择Box Shadow属性。
第三步,修改Duration为500 MS。
一个蓝色的文本“联系我们!”的按钮显示了两次。左边的按钮处于正常状态。在右边,按钮处于悬停状态,后面有一个方框阴影

了解更多关于过渡和其他效果的知识。

尝试Webflow——它是免费的
Baidu
map