Forums

Give help. Get help.

  • # November 16, 2017 at 12:39 pm

    Hello,

    I have an svg that I animated,

    The animation works smoothly, and I have it set to animation-fill-mode: forwards to that it stays put after it’s done animating.

    currently, in the svg html, I have the stroke set to none, and then in the @keyframes css, I have it:

    from{ stroke: none; }
    to { stroke: #fff; }

    once it’s done animating, I want the strokes to change color on :hover, which it does.

    but once I move the cursor away, the animation starts over.

    how would I go about making the SVG return right back to it’s #FFF stroke without triggering the animation after the hover is complete?

    Here’s my codepen

    # November 18, 2017 at 3:09 am

    I think making the SVG return right back to it’s #FFF stroke need triggering the animation…

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag