KuTuGu / guitarView

A view for guitar animation

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

FLIP动画

优点

  • transform 和 opacity 开启 GPU 硬件加速
  • transform 利用 tranlate 和 scale 完成平移和缩放
  • transition 只需监听 transform 动画,变化源唯一,整体动画更加平滑稳定,保证一致

细节注意

  • 展示图动画完成后尽量避免脱离文档流定位
    • 可能导致父元素尺寸变化影响布局
    • 元素定位顺序可能对其他兄弟元素产生影响
  • 注意字体缩放,包含字体的容器尽量采用行内块(inline-block),避免块级元素动画前后尺寸缩放,影响字体大小
  • 动画前后尽量只做 平移和缩放 等transform、opacity副作用,其他副作用需要针对性处理
  • 其他副作用的存在可能导致动画不平滑稳定

About

A view for guitar animation


Languages

Language:JavaScript 54.8%Language:CSS 23.9%Language:HTML 21.2%