我有一个问题是宽度悬停对图像的影响 当光标在图像链接上时,图像上会出现黄色div //它可以正常工作
当光标离开图像时,黄色div消失了//确定
我想做什么: 单击图像时,它会调用第二页(ok),但是当您返回第一页时,图像已经显示为黄色div (就像它保持悬停效果,这对于每个点击的图像都是如此)
我完全迷失了!
我的代码:
.slick {
-webkit-transition: all 0.5s ease-out;
-khtml-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.projet-container {
position:relative;
display:block;
margin:2px;
}
.projet-titre {
position:absolute;
display:block;
top:0;
height:184px;
width:184px;
opacity:0;
filter:alpha(opacity=0);
}
.titre {
display:block;
padding:0px 20px;
text-transform:uppercase;
margin:30px 0px 0px 0px;
font-size:1.2em;
line-height:1.3em;
}
.projet-container a {
margin:0;
padding:0;
}
.projet-container a:hover .projet-titre, .projet-container a:focus .projet-titre {
opacity:1;
filter:alpha(opacity=100);
background:#ffff00 url(img/projet-hover.png) no-repeat center center;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
width:184px;
}
<div class="projet-container">
<a href="2.html">
<img src="urbanisme.gif">
<div class="projet-titre slick">
<span class="titre">lorem ipsum</span>
</div>
</a>
</div>
<div class="projet-container">
<a href="2.html">
<img src="1_logement.gif">
<div class="projet-titre slick">
<span class="titre">lorem ipsum</span>
</div>
</a>
</div>