Question

我已从Illustrator导出svg个文件。

现在我正在为线条工作制作动画。我知道如何改变动画的方向但是如何（如果）可以确定动画的起点？

这是一个例子：

＆＃13;

@keyframes lines {	0% {fill: none;} 	50% {fill: none;	stroke-dashoffset: 0;}	100% {fill: none ;stroke-dashoffset: 0;} }

.nose_outer{ animation: lines 4s ease forwards; stroke-dasharray: 186.514; stroke-dashoffset: -186.514; }

＆＃13;

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 768 768">

  	<title>svg</title>
	<g><!-- NOSE OUTER -->
		<path class="nose_outer" d="M396.667,406.31A17.016,17.016,0,0,0,381,416.686a17.008,17.008,0,1,0,0,13.266,17.011,17.011,0,1,0,15.667-23.642Z" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="5"/>
	</g>
  </svg>

＆＃13;

在stroke-dashoffset上使用负值和正值可以改变方向。

在导出到svg之前，我是否必须在Illustrator中更改某些内容？

确定startpoint svg动画

0 个答案: