user3663071 user3663071 - 3 months ago 19
Javascript Question

Javascript rotate - how to rotate counterclockwise?

I have two shapes that I made to rotate on scroll. I was able to rotate them clockwise, however I would like the second shape to rotate counterclockwise.

JSFiddle: https://jsfiddle.net/7tLv05on/

Here is the following code I used to achieve that:

var sdegree = 0;

$(window).scroll(function() {

sdegree ++ ;
sdegree = sdegree + 2 ;

var srotate = "rotate(" + sdegree + "deg)";

$(".move1").css({"-moz-transform" : srotate, "-webkit-transform" : srotate});
$(".move2").css({"-moz-transform" : srotate, "-webkit-transform" : srotate});

});


Thank you I really appreciate the help!

Answer

Just do it like this:

  var sdegree = 0;
  var sdegree2 = 0;

  $(window).scroll(function() {

    sdegree ++ ;
    sdegree = sdegree + 2 ;

    sdegree2 -- ;
    sdegree2 = sdegree2 - 2 ;

    var srotate = "rotate(" + sdegree + "deg)";
    var srotate2 = "rotate(" + sdegree2 + "deg)";

    $(".move1").css({"-moz-transform" : srotate, "-webkit-transform" : srotate});
    $(".move2").css({"-moz-transform" : srotate2, "-webkit-transform" : srotate2});

  });
Comments