当我将鼠标悬停在图像上时，我希望覆盖悬停效果激活

Question

当我将鼠标悬停在图像上时，我希望覆盖图的淡入效果可以激活。我刚开始在我的第一个网站工作，我是一个javascript begginer，所以我需要一些帮助。这是一个jsfiddle。

HTML代码：

<div class = "leftpart">  
    <a href="http://www.google.com"> 
     <img src="images/test.jpg"/> 
     <div class="flex-caption hvr-fade">Adventurer Lemon</div> 
    </a> 
</div> 

我没有任何JavaScript代码。

Answer 1

插图的CSS一个多类

主类中添加悬停效果，然后使用.leftpart:hover然后 页脚颜色变化再加入hvr-fade之后再effece主要 股利悬停

.leftpart:hover .hvr-fade 
{ 
    background-color: #2098d1; 
    color: white; 
} 

Live Demo

Answer 2

您可以通过css也可以

.leftpart a img:hover{opacity:0.8;}