Javascript 发生变换旋转后保持的元素变换比例

我有一个元素，我正在放大（一个按钮），然后旋转（另一个按钮）

当我放大元素时，比例会更新，然后当我转到旋转元素时，比例不会从缩放中保留（但实际上是这样，我可以看到值保持为“浏览器调试”），但单击旋转时，比例会缩小回初始比例

let spin=0；
让zoom=1；
$（'#SpinRight'）。单击（函数（）{
//我知道，事实上，比例在这里保持不变，但当我//单击“旋转”时，比例会缩小到原始大小
自旋+=25；
$（'#element'）.css（{'transform'：'rotate（'+spin+'deg'}）；
})
$（“#放大”）。单击（函数（）{
缩放+=0.1；
$（'#element'）.css（{'transform'：'scale（'+zoom+'））}）；
})

转换

规则不堆叠，因此如果您堆叠规则：

变换：旋转（45度）；
变换：比例（0.5）；

scale

变换替换了

rotate

规则，它不会添加到该规则中。如果希望同时使用这两个规则，则需要在单个规则中指定这两个规则：

变换：旋转（45度）比例（0.5）；

您可以跟踪css属性中的旋转和缩放，然后制定一条规则来应用这两种属性（或者按照您已经在做的方式应用它们，但每次更新都要同时应用这两种属性）

const demo=document.querySelector（'.demo'）；
旋转=0；
设标度=1；
document.querySelector（'.rotate'）。addEventListener（'click'，（）=>{
setProperty（'--rotate'，`${rotate+=10}deg`）；
});
document.querySelector（'.scale'）.addEventListener（'click'，（）=>{
demo.style.setProperty（'--scale'，scale+=0.1）；
})；

.demo{
--旋转：0；
背景：天蓝色；
宽度：100px；
高度：100px；
变换：旋转（var（--rotate，0））比例（var（--scale，1））；
}
钮扣{
位置：相对；/*使按钮保持在顶部*/
}

旋转
缩放

变换

规则不堆叠，因此如果您堆叠：

变换：旋转（45度）；
变换：比例（0.5）；

scale

变换替换了

rotate

规则，它不会添加到该规则中。如果希望同时使用这两个规则，则需要在单个规则中指定这两个规则：

变换：旋转（45度）比例（0.5）；

您可以跟踪css属性中的旋转和缩放，然后制定一条规则来应用这两种属性（或者按照您已经在做的方式应用它们，但每次更新都要同时应用这两种属性）

const demo=document.querySelector（'.demo'）；
旋转=0；
设标度=1；
document.querySelector（'.rotate'）。addEventListener（'click'，（）=>{
setProperty（'--rotate'，`${rotate+=10}deg`）；
});
document.querySelector（'.scale'）.addEventListener（'click'，（）=>{
demo.style.setProperty（'--scale'，scale+=0.1）；
})；

.demo{
--旋转：0；
背景：天蓝色；
宽度：100px；
高度：100px；
变换：旋转（var（--rotate，0））比例（var（--scale，1））；
}
钮扣{
位置：相对；/*使按钮保持在顶部*/
}

旋转
Scale

transform

只有一个值，您必须将所有转换函数调用组合成一个字符串，或者使用。您能给我一个当前逻辑的例子吗？我确信您可以在没有示例的情况下连接字符串，您的代码中已经有多个字符串连接。在

之间是否有逗号（值）

和

刻度（值1）

？不，您可以在ray的回答中看到，或者从…

转换读取的值只有一个值，您必须将所有转换函数调用合并到一个字符串中，或者使用。您能给我一个当前逻辑的示例吗？我确信您可以在没有示例的情况下连接字符串，您已经有多个字符串连接了在你的代码中，是否有一个逗号在
rotate（value）
和
scale（value1）
之间？不，你可以在ray的回答中看到，或者从…中读取，这个逻辑可以像我的帖子一样与javascript一起执行吗？这个逻辑可以像我的帖子一样与javascript一起执行吗？