.path {инсульт-дашаррей: 10; смещение штриха: 1000; анимация: линейные рывок вперед 5s; } @keyframes dash {to {stroke-dashoffset: 0; штрих-черта: 0; }}
ел бы оживитьпунктир в SVG-файле. Линия должна «расти» от 0 до полной длины. Все методы, которые я нашел, мне не подходят.
У кого-нибудь есть идея, как это решить?
Вот путь в моем файле SVG:
<path class="path" fill="none" stroke="#FFFFFF" stroke-miterlimit="10" d="M234.3,119
c-31-0.7-95,9-128.7,50.8"/>
Чтобы оживить линию какПрямо линия, которую я сделал:
.path {
stroke-dasharray: 1000;
stroke-dashoffset: 1000;
animation: dash 5s linear forwards;
}
@keyframes dash {
to {
stroke-dashoffset: 0;
}
}
Конечно, это не работает, когда я хочу, чтобы линия была пунктирной. Есть кто-нибудь, у кого есть идеи, как это решить?
Это мой кодекс:http://codepen.io/anon/pen/WpZNJY
PS: я не могу использовать два пути друг над другом, чтобы скрыть путь внизу, потому что у меня цветной фон.