CodePen 在上面的代码中有一个SVG,笔画动画进入视图,但最后它只是消失了. 有没有办法在加载后将其保持在视图中? .path { stroke-dasharray: 1000; stroke-dashoffset: 1000; animation: dash 5s linear altern
在上面的代码中有一个SVG,笔画动画进入视图,但最后它只是消失了.
有没有办法在加载后将其保持在视图中?
.path { stroke-dasharray: 1000; stroke-dashoffset: 1000; animation: dash 5s linear alternate; } @keyframes dash { from { stroke-dashoffset: 1000; } to { stroke-dashoffset: 0; } }将这两个属性添加到.path中
animation-fill-mode: forwards; // Stay on the last frame animation-iteration-count: 1;// Run only once
Css将是:
.path { stroke-dasharray: 1000; stroke-dashoffset: 1000; animation: dash 5s linear alternate; animation-fill-mode: forwards; // Stay on the last frame animation-iteration-count: 1; }
Codepen是Here,它的工作正常.