用css3淡化背景图像

Question

嘿大家...... 我想知道为什么这不起作用？

.right-article.boy {
    background: transparent url(../images/boxes-bg/boy.jpg) left top no-repeat;
    width: 413px;
    height: 242px;
    -webkit-transition: background 1.5s linear;
    -moz-transition: background 1.5s linear;
    transition: background 1.5s linear;
}

.right-article.boy:hover {
    background: transparent url(../images/boxes-bg/boy-hover.jpg) left top no-repeat;
}

如果我将背景更改为黄色和悬停，黑色等颜色，它可以正常工作....但不是我的图像？

Answer 1

我无法想象在1.5秒内图像会如何变化 我会这样做有点不同：
 http://jsfiddle.net/seler/48BM4/1/或http://jsfiddle.net/seler/48BM4/2/

图像可以像这样工作： http://jsfiddle.net/seler/48BM4/3/

另一个例子是自动高度，不需要复制内容：
http://jsfiddle.net/seler/48BM4/7/

Answer 2

看看http://css3.bradshawenterprises.com/cfimg/ - 我写这篇教程是为了帮助解决这类问题的人！