chuyển đổi webkit không hoạt động trong chrome và safari

Question

Tôi đang gặp sự cố khi chuyển sang làm việc trong trình duyệt webkit, trong khi nó hoạt động hoàn hảo trong firefox. Mã của tôi là bên dưới

HTML 
<div class="dropdown" data-id="new-houses"> 
<h3>New Houses</h3> 
<img src="/local/images/down-arrow.png" /> 
</div> 
<div id="new-houses" style="display:none;"> 
<!--content of div--> 
</div> 

CSS 
.dropdown{ 
    width:100%; 
    cursor:pointer; 
    height:50px; 
    clear:both; 
} 
.dropdown img{ 
    width:20px; 
    height:17px; 
    float:right; 
    margin-right:20px; 
    margin-top:17px; 
    -webkit-transition:transform 1s; 
    -moz-transition:transform 1s; 
    -ms-transition:transform 1s; 
    -o-transition:transform 1s; 
    transition:transform 1s; 
} 
.point_down{ 
    transform:rotate(180deg); 
    -webkit-transform:rotate(180deg); 
    -moz-transform:rotate(180deg); 
    -ms-transform:rotate(180deg); 
    -o-transform:rotate(180deg); 
} 

jQuery 
$('.dropdown').click(function(){ 
    var self = $(this); 
    self.find('img').toggleClass('point_down'); 
    $('#'+self.attr('data-id')).slideToggle(1000); 
}); 

Biến đổi đang hoạt động trong FF, Safari và Chrome, nhưng quá trình chuyển đổi chỉ hoạt động với FF. Tôi đã thử thay đổi img cho cả hai khối nội tuyến và khối, mà không có sự khác biệt tôi có thể nhìn thấy. Có ai gặp phải điều này trước đây hay không, hoặc có thể xem có điều gì sai với mã của tôi không? Bất kỳ trợ giúp nào bạn có thể cung cấp sẽ được đánh giá cao.

Answer 1

Đó là

-webkit-transition:-webkit-transform 1s;