如何将css变换添加到当前变换值使用jquery?

时间:2016-12-28 06:02:47

标签: javascript jquery jquery-ui

目前,当警报

时,我有一个变换值为rotate(57deg)的类

$(".div-1").css("transform")它给出了矩阵值。

<style> 
 .div-1{
     transform: rotate(57deg);
     }                 
</style>   
<div class="div-1">Test</div>
  

我需要将scale(-1, 1)添加到现有的转换值中   Jquery的

。所以.div-1变换值变成div-1 { transform: scale(-1, 1) rotate(57deg); }怎么做?这里57只是一个数字,它将永远改变。所以我需要的是将scale( -1 , 1)添加到当前变换值。请帮忙。

3 个答案:

答案 0 :(得分:4)

你可以这样做:

var css = $('.div-1').css("transform");
css = css+" scale(-1,1)";
$('.div-1').css('transform',css);

答案 1 :(得分:1)

<style>
    div {
        -ms-transform: rotate(57deg); // IE 9  
        -webkit-transform: rotate(57deg); // Chrome, Safari, Opera  
        transform: rotate(57deg);
    }
</style>

答案 2 :(得分:-1)

替代解决方案是创建两个类

<style> 
 .div-1{
     transform: rotate(57deg);
     }    
  .div-2{
     transform: scale(-1, 1) rotate(57deg);
     }             
</style>   
<div class="div-1">Test</div>

然后在jquery中执行以下操作:

if(condition == true){
$(".div-1").addClass("div-1");
$(".div-1").removeClass("div-2");
} else {
$(".div-1").addClass("div-2");
$(".div-1").removeClass("div-1");
}