Please enable JavaScript.
Coggle requires JavaScript to display documents.
Animation (渲染 Render (優化 (只變動Composite屬性
animate.css中很多的動畫都是用這個實現的。
…
Animation
渲染 Render
-
優化
只變動Composite屬性
animate.css中很多的動畫都是用這個實現的。
transform, : opacity
多層繪製方式
使用tranform來實現移動效果的元素將會被正常繪製,同時不會觸發對其他元素的繪製
will-change (兼容性不太友好), 3D transform
-
事件 Event
CSS 動畫事件 animation event
Transition 過渡: TransitionEnd
Animation: Animationstart, Animationiteration, Animationend
:check:requestAnimationFrame
針對動畫效果的API,與顯示器固定的刷新頻率保持同步,利用這個刷新頻率進行頁面重繪
:no_entry:setInterval、setTimeout
常用的setInterval、setTimeout是開發者主動要求瀏覽器去繪製,因為動畫不會與螢幕的刷新率同步,很可能出現抖動和跳幀
-