Как сделать эффект рисования?

Как сделать эффект рисования при наведении на ссылку?
Просто растягивать эту svg на 100% не подходит. Есть ссылки с разной шириной.
Есть какие-нибудь идеи?
614432f9f0dd7729598405.png

Сама svg, если что:
<svg width="149" height="7" viewBox="0 0 149 7" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 3.0993C10.1667 1.83442 28.3 -0.177873 27.5 1.89192C26.5 4.47916 38.5 1.89192 41.5 1.89192C44.5 1.89192 52.5 1.89192 49.5 3.78922C46.5 5.68653 70.5 1.89192 75.5 1.89192C80.5 1.89192 72.5 6.0315 77.5 5.85902C82.5 5.68653 92.5 1.89192 99 1.89192C105.5 1.89192 99.5 6.89391 106 5.85902C112.5 4.82412 124.5 -0.00538788 129 1.89192C133.5 3.78922 123.5 6.20398 132.5 4.9966C139.7 4.0307 145.833 2.52435 148 1.89192" stroke="#458D36" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
  • Вопрос задан
  • 286 просмотров
Решения вопроса 2
Rsa97
@Rsa97
Для правильного вопроса надо знать половину ответа
Ответ написан
profesor08
@profesor08 Куратор тега CSS
Анимируй stroke-dashoffset параметр, там можно разные интересны вещи делать. Примеров в интернете вагон.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
mrusklon
@mrusklon
если долго мучится - что нибудь получится
просто этого веб(нет) дизайнера пинками запинать пускай сам такое сверстает xD
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы