background-size的transition不生效的解决方案

background-size的transition可能不生效的原因

今天在实现鼠标悬浮背景图渐渐扩大的效果时，遇到一个坎：

div{
    background-size:cover;
    transition:background-size .5s;
}
div:hover{
    background-size:120% auto;
}

以上是css样式，然而，当鼠标悬浮在div上时，背景图扩大了但是却没有过渡效果。由于background-size属性的值是连续型的，transition是支持的呀。百度一番之后，找到了答案：
https://stackoverflow.com/questions/31718598/transition-on-background-size-doesnt-work。
因为background-size的值从cover变化到120% auto不能让transition判断出渐变过程（cover与120% auto非同种值）。

解决方案

以一种与120% auto同等的方式来替换cover：
我使用cover的目的是在数值方向上截取背景图片，因此可用100% auto来替换。