CODEWITHSUNDEEP
javascriptjquerysvgjquery-animate
Tom
Tom

Reputation: 927

Animate Spin SVG Element with JQuery

I want to animate the transformation of this SVG element. I wish this worked:

$(this).find('polygon').animate({
    transform: "rotate(360)"
}, 5000);

Upvotes: 1

Views: 664

Answers (1)

Chris Heijnen
Chris Heijnen

Reputation: 129

Check this JSFiddle i made for you. You could add an extra class and put the animation on that extra class.

.chevron.rotate {
    -ms-transform: rotate(360deg); /* IE 9 */
    -webkit-transform: rotate(360deg); /* Chrome, Safari, Opera */
    transform: rotate(360deg);
}

and then do this in your javascript:

$('.rotate-btn').on('click', function() {
    $('.chevron').addClass('rotate');
});

Upvotes: 2

Related Questions