logo

该视频仅会员有权观看

立即开通课程「Vue.js前端应用开发实践」权限。

¥
199
/ 年

基于 Class 的动画

  • 在app组件中,给按钮绑定了一个名为active的类,根据is active数据绑定。
  • is active默认值设为false
  • 样式表中设置,若按钮有active类,背景变黑,文字变白。
  • 外层卡片组件加div展示is active状态,样式表中调整文字居中,设置边距。
  • 定义名为pos的动画,使元素放大到1.5倍后缩小为原始尺寸。
  • pos类应用此动画,持续时间一秒,无限重复。
  • is activetrue时,表情符号元素绑定pos类,触发动画。