jQueryでopacityとtransformを一つの要素に実装できません。

Question

前提・実現したいこと

jQueryでimg要素にopacityとtransformを実装したいのですが結果はopacityしか実装されませんでした。
なぜですかね？

発生している問題

問題は実装されているのがopacityだけであること

該当のソースコード

$(function(){  
        
        menuwork=function(){
        
        windowvalue=$(window).scrollTop();

                $("img[class^=front-]").css("opacity","0","transform","translateY(-60vh)");
                $(".front-"+picturenamed).css("opacity","1","transform","translateY(-30vh)");
                $(".picture-13").css("transform","scale(1.2,1.2)");
       };
    });

Answer 1

↓こちらでいかがでしょうか?

$(function () {
  menuwork = function () {
    windowvalue = $(window).scrollTop();

    $("img[class^=front-]").css({
      "opacity": "0",
      "transform": "translateY(-60vh)"
    });
    $(".front-" + picturenamed).css({
      "opacity": "1",
      "transform": "translateY(-30vh)"
    });
    $(".picture-13").css({
      "transform": "scale(1.2,1.2)"
    });
  };
});

Comments

[ga-doman]

できました！ありがとうございます！しかし、自分の書き方はもともと間違っていたのでしょうか？違うものによってはできるときもあったような気がするのですが

Answer 2

複数CSSはオブジェクトで指定すればできると思います。
たとえば以下ならhelloがナナメになります。

<p>hello</p>

var obj = { "opacity":"0.5", "transform":"rotate(10deg)" };
$("p").css( obj );

p.s.
menuworkはそこに新しく出てくるものであればvarなどで宣言した方がいいのでは？