BestHub
Sign in
Tag

SVG Animation

0 views collected around this technical thread.

NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Jun 23, 2021 · Frontend Development

Complete Guide to SVG: Elements, Animations, and Practical Applications

This guide explains why SVG outperforms raster images, details core elements like the svg container and path commands along with basic shapes, and compares three animation methods—SMIL, CSS, and JavaScript—offering practical techniques such as line drawing, morphing, stroke effects, and motion‑path animation for responsive, scalable web graphics.

CSS animationFrontend DevelopmentPath Morphing
0 likes · 26 min read
Complete Guide to SVG: Elements, Animations, and Practical Applications
ByteFE
ByteFE
Jun 15, 2021 · Frontend Development

Generating Chinese Character Stroke Order Animations from Font Files

This article details a technical approach to automatically generating stroke order animation data for Chinese characters from standard font files, covering SVG rendering, coordinate transformations, deep learning-based stroke decomposition, and CSS animation techniques.

AlgorithmFont ParsingFrontend Development
0 likes · 20 min read
Generating Chinese Character Stroke Order Animations from Font Files
ByteFE
ByteFE
Feb 24, 2021 · Frontend Development

A Practical Guide to Creating SVG Animations with GSAP and TimelineMax

This tutorial demonstrates how to easily create dynamic SVG animations by leveraging the GreenSock Animation Platform (GSAP), specifically focusing on TimelineMax and staggerFrom methods to manipulate DOM elements, apply easing functions, and sequence complex visual effects with minimal code.

CSS SelectorsDOM ManipulationFrontend Development
0 likes · 7 min read
A Practical Guide to Creating SVG Animations with GSAP and TimelineMax