2012-04-25 136 views
1

在这个网站中,我提供了一个箭头链接,当您将鼠标悬停在它上面时,它将成为一幅新图片,并且图片中还有一个很酷的附加内容。我已经在下面的代码中完全正常工作了,而且我根本没有编辑代码,但似乎当我醒来时,“全部”转换不再适用于此。我找不到有什么问题。我也使用它来淡化背景图像,这是一种纯色,以淡出另一种纯色背景图像。CSS3背景图片转换

a.visitarrow 
{ 
-webkit-transition:all 1.0s ease-in-out; 
-moz-transition:all 1.0s ease-in-out; 
-o-transition:all 1.0s ease-in-out; 
-ms-transition:all 1.0s ease-in-out;   
transition:all 1.0s ease-in-out; 
display:block; 
width:130; 
height:121; 
background-image:url('pictures/visit.png'); 
} 

a.visitarrow:hover 
{ 
-webkit-transition:all 0.5s ease-in-out; 
-moz-transition:all 0.5s ease-in-out; 
-o-transition:all 0.5s ease-in-out; 
-ms-transition:all 0.5s ease-in-out;   
transition:all 0.5s ease-in-out; 
display:block; 
width:130; 
height:121; 
background-image:url('pictures/visithover.png'); 
} 
+0

我虽然你可以不转型背景IMG。你确定它有效吗? – mddw 2012-04-25 12:37:58

+0

我100%确定它可以工作大约一周 – 2012-04-25 12:41:10

+0

也许浏览器更新? Firefox昨天更新了。 – mddw 2012-04-25 12:42:53

回答

1

我认为这应该工作:

a.visitarrow { 
    display: block; 
    width: 130; 
    height: 121; 
    -webkit-transition: 1.0s ease-in-out; 
    -moz-transition: 1.0s ease-in-out; 
    -o-transition: 1.0s ease-in-out; 
    -ms-transition: 1.0s ease-in-out;   
    transition: 1.0s ease-in-out; 
    background-image: url('pictures/visit.png'); 
} 

a.visitarrow:hover { 
    background-image: url('pictures/visithover.png'); 
}