Webkit中的css3背景大小过渡动画不起作用…… Bug？还是错误的语法？

动画背景大小属性似乎不适用于Chrome或Safari. div { width: 161px; height: 149px; background: url(http:/

...动画背景大小属性似乎不适用于Chrome或Safari.

div {    width: 161px;    height: 149px;    background: url(http://3.bp.blogspot.com/_HGPPifzMEZU/Rw4ujF12G3I/AAAAAAAAAWI/bc1ppSb6eKA/s320/estrelas_09.gif) no-repeat center center;    background-size: 50% 50%;    transition: background-size 2s ease-in;    -moz-transition: background-size 2s ease-in;    -web-kit-transition: background-size 2s ease-in}div:hover {    background-size: 100% 100%}

<div>hey</div>

http://jsfiddle.net/ubcka/14/

.

解决方法

. 您应该检查浏览器版本以及它是否支持后台大小和转换.如果是前者,而不是后者使用：

transition: background-size 2s ease-in;-moz-transition: background-size 2s ease-in;-ms-transition: background-size 2s ease-in;-o-transition: background-size 2s ease-in;-webkit-transition: background-size 2s ease-in;

. ..