<link href='//fonts.googleapis.com/css?family=Signika+Negative:300,400' rel='stylesheet' type='text/css'>
<div class="wrapper">
<div class="arrow"></div>
</div>
<div class="brandBar">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/GreenSock-logo-text-outlines.svg"></div>
var degrees = 45;
var tween = gsap.to(".arrow", {
duration: 4,
rotation: 360,
modifiers: {
rotation: gsap.utils.unitize(function(rotation) {
//snap to 45 degree increments
return Math.round(rotation / degrees) * degrees;
})
},
// in GSAP 3 you can do this instead:
// snap: {rotation: degrees},
ease: "none",
repeat: 6,
})