transformOrigin: "50% 50%" Not applying

[Metlock]

I'm fairly new to development and Javascript in general I can't get transformOrigin: "50% 50%" to work no matter what I try. I've read every post on the matter it just won't work for me in my setup. Any help appreciated! - John

 

document.getElementById("cpuLoose").addEventListener("click", function(){
    
var plAttackAnim  = new TimelineMax({ repeat: 0, repeatDelay: 0.5, yoyo: false })
    .set(".card2", {transformOrigin: "50% 50%"})
    .to(card1, 2, { pixi: {x: 400, y: 150, scale: 0.5,}, ease: Power4.easeInOut }, 0)
    .call(PlayHitSound)
    .to(vs,    2, { pixi: {alpha: 0, }, ease: Power4.easeInOut }, 0.0)
    .to(card2, 2, { pixi: {x: 1500, y: 150, scale: 0.2,},rotation:'+=360',transformOrigin:'center',ease:Power3.easeInOut }, 2.0)
    .to(card1, 2, { pixi: {x: 450, y: 150, scale: 0.5,}, ease: Power4.easeInOut }, 2.3)
    .to(card1, 2, { pixi: {x: 400, y: 120, scale: 0.6,}, ease: Power4.easeInOut }, 2.6)

    
});

[ZachSaucier]

Hey Metlock and welcome to the GreenSock forums.

 

There's nothing obviously wrong with your code from what I can tell. Can you please create a minimal example in something like a CodePen? The below thread can help you do so: