infinate rotatation using an SVG in Gsap

[Darkin]

Hello guys,

 

I'm new here, and i'm trying to make this SVG rotate forever, but it just won't work, i've tried making the time -1 and it still wont work.

any suggestions?

Thanks.

 

<script>

//we'll use a window.onload for simplicity, but typically it is best to use either jQuery's $(document).ready() or $(window).load() or cross-browser event listeners so that you're not limited to one.

window.onload = function(){

 

 

var logo = document.getElementById("logo");

 

var tween =TweenLite.to(logo, 5, {rotation:360, transformOrigin:"50% 50%"}); //keywords

   tween.restart();

 

 

 

}

</script>

[Carl]

Hi and welcome to the GreenSock forums.

 

The trick is to use a TweenMax tween. TweenMax tweens have more features than TweenLite tweens (repeating being one of them)

 

Something like this

TweenMax.to(".gear", 4, {rotation:360, repeat:-1, transformOrigin:"50% 50%", ease:Linear.easeNone});

http://codepen.io/GreenSock/pen/NqgboL

 

More on TweenMax: http://greensock.com/tweenmax