向下滚动时出现并缩放

Question

我喜欢HTML：

<div class='service'>
 <img src='img.png'/>
</div>

我使用了css：

.service img{opacity:0; -webkit-transform: scale(0.2);}

当我向下滚动时，它会显示但不会缩放transform： 我用过：

$(this).animate({'opacity':'1','-webkit-transform':'scale(1)'},1000);

你可以帮我修理吗？感谢。

Answer 1

我正在阅读jQuery .animate()上的文档，似乎不支持CSS'scale（）'属性。

所以在这个FIDDLE中我只是切换到了身高和宽度。

JS

$('#clickme').click(function(){
    $('.service img').animate({ 'opacity': '1',
                                  'width': '400',
                                 'height': '450'
                               }, 1000);

});