qq_34306228的博客

闪烁动画效果的核心在于控制元素颜色的变化，掌握好时间的控制，让颜色的变化有引人注目的显示，这样在静态的页面中，自然会吸引住用户的眼球。多条折线同时闪烁，每条折线都有自己的动画设定，所以在 GSAP 中我们不能使用 timeline，动画不是线性的，而是并行的。整个图的svg：做动画在 Web 页面开发中使用 SVG 生成背景

在做形状转换的时候，转换前形状的控制点和转换后的控制点数最好相同，这样效果能好些。可以轻松实现一个带有蒙版效果的动画。GreenSock 中使用。

SVG 中实现描边动画的三个相关属性：分别是 、、 属性用来指定路径从开始位置的偏移量。通过指定偏移量会让绘制好的线偏移原来的位置一段空白升级版借助 DrawSVGPlugin 实现了将 SVG path 从 0% 绘制到 100% 的动画效果。一个元素（物体）沿着特定的路径（轨迹）进行运动。 这个属性接受一个 path 用于指定元素的运动轨迹。 这个属性声明了元素沿着路径运动的距离。常用 100% 表示路径总长度。svg使用的是元素使用 GreenSock 来实现自行车沿着路径运动的路径动画

GSAP内置缓动动画，默认的值为,让 circle 像球一样弹起运动。只需设定属性 gsap.timeline()拥有操纵时间轴线的能力，会让动画有序进行下面例子时间轴动画时长为 duration: 0.66 ，下面让第 2、3、4 个 circle 使用相对时间，减去动画时长，那么制造了多个 circle 一同运动的效果。升级版： 提供了一个用于控制时间交错的属性： ，这个属性同样是对动画时间的控制，比如让多个 circle 同时以 的时间错开进行Y轴位移运动

linearGradient>标签必须嵌套在。

用a标签链接SVG形状矩形 圆形 椭圆 线 折线 多边形 路径 矩形rect 元素的 width 和 height 属性可定义矩形的高度和宽度style 属性用来定义 CSS 属性CSS 的 fill 属性定义矩形的填充颜色（rgb 值、颜色名或者十六进制值）CSS 的 stroke-width 属性定义矩形边框的宽度CSS 的 stroke 属性定义矩形边框的