在jQuery中的Css轉換

Question

我有img，我需要將它旋轉90度，當我點擊它時。

<img src="img/right-arrow.png" alt="" class="show"> 

當我在CSS中使用

.show { 
transform: rotate(90deg); 
} 

文件，它的工作原理。 但是當我在jQuery中做它不起作用。 這裏是我的jQuery

$('.show').click(function(){ 
    $(this).css("-webkit-transform" : "rotate(90deg)"); 
} 
); 

Answer 1

碼這是因爲你在你的函數使用的:，改爲使用逗號：

$(this).css("-webkit-transform", "rotate(90deg)"); 

Answer 2

試試這個

$('.show').click(function(){ 
    $(this).css({ 
    '-moz-transform':'rotate(90deg)', 
    '-webkit-transform':'rotate(90deg)', 
    '-o-transform':'rotate(90deg)', 
    '-ms-transform':'rotate(90deg)', 
    'transform':'rotate(90deg)' 
    }); 
}); 

Answer 3

在這裏看到jsfiddle

，如果你想在JQ你的CSS使用:你需要把整個代碼{}

之間，像這樣：

$('.show').click(function(){ 
    $(this).css({"-webkit-transform" : "rotate(90deg)"}); 
} 
); 

或者如果你不想使用{}使用,代替:像這樣

$('.show').click(function(){ 
    $(this).css("-webkit-transform" , "rotate(90deg)"); 
} 
); 

Answer 4

試試這個：

$('.show').click(function(){ 
    $(this).css({"-webkit-transform" : "rotate(90deg)"}); 
} 
); 

DEMO HERE