我有一个div,我正在更改其背景(使用jQuery)。这些CSS3规则可以让新的背景图像漂亮地淡入。
transition: background-image 1s ease-in-out;
background: center center no-repeat;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
问题在于背景大小也在过渡。例如,如果在淡入淡出时从纵向转换为横向背景图像,则图像会在垂直方向上被挤压,然后在水平方向上被拉伸。这可能会让人感到有点恶心。
有没有办法使用
background-size: cover
但只对背景图像本身进行淡入淡出的过渡而不改变背景大小?
background-image
,并且不像Chrome一样在交叉淡入淡出期间遭受图像拉伸的问题。 - Corey