webkit geçişleri chrome ve safari'de çalışmıyor

Question

Web tarayıcısı tarayıcılarında çalışmak için geçiş yaparken sorun yaşıyorum. Kodum FF, Safari ve Chrome çalışıyor dönüşümü

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); 
}); 

altındadır, ancak geçiş sadece FF ile çalışır. Img'i hem satır içi hem de blok olarak değiştirmeyi denedim, ki farkedemediğim bir fark yarattı. Daha önce bununla karşılaştı mı, yoksa kodumda bir sorun olup olmadığını görebilir mi? Sunduğunuz herhangi bir yardım çok takdir edilecektir.

Answer 1

O sayesinde çok

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