如何CSS轉換適用於背景圖片

Question

如何添加背景轉換到後臺尺寸如果代碼如下：

的jsfiddle鏈接，完整的代碼：https://jsfiddle.net/3x4vhtj6/

div { 
    background-size: 100% auto; 
} 

div:hover { 
    background-size: auto 100%; 
} 

更新

如果這是不可能的與當前版本的CSS是他們的任何其他方式來做這種效果與js或jQuery。

Answer 1

transition屬性是你在找什麼。但是，您需要使用固定值才能使轉換生效。

如果您別無選擇，仍然可以使用jQuery來計算值，然後使用jQuery .css()方法添加css屬性。

您的使用情況下，你可以寫這樣的事情：

的jQuery：

$('.my-div').css({ background-size: getBackgroundSize() }); 

CSS：

div.my-div { 
    transition: all 1s; 
} 

div.my-div:hover { 
    transition: all 1s; 
}