Javascript rotieren - wie gegen den Uhrzeigersinn drehen?

Question

Ich habe zwei Formen, die ich gemacht habe, um auf Scroll zu drehen. Ich konnte sie im Uhrzeigersinn drehen, aber ich möchte, dass sich die zweite Form gegen den Uhrzeigersinn dreht. JSFiddle

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

Hier ist der folgende Code, den ich verwendet, um das zu erreichen:

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}); 

}); 

Danke Ich schätze die Hilfe!

Answer 1

Just do it wie folgt aus:

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}); 

    }); 

Answer 2

var sdegree = 0; 

$(window).scroll(function() { 

    sdegree ++ ; 
    sdegree = sdegree + 2 ; 

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

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

    //negative degree 
    var sdegree2 = -sdegree; 
    srotate = "rotate(" + sdegree2 + "deg)"; 
    $(".move2").css({"-moz-transform" : srotate, "-webkit-transform" : srotate}); 

}); 

fiddle

Answer 3

Gerade Wert mit -1 multiplizieren und das ist es:

var sdegree = 0; 

$(window).scroll(function() { 

sdegree ++ ; 
sdegree = sdegree + 2 ; 

var cwRotate = "rotate(" + sdegree + "deg)", 
    ccwRotate = "rotate(" + (-1 * sdegree) + "deg)"; 

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

}); 

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