图像(图像悬停)
问题描述:
HTML:图像(图像悬停)
<div class="image"><a href="$ENTRY_URL$" title="$TITLE$ online">
<img class="avkas rad2" src="$IMG_URL1$" width="130px">
<img src="/images/star.png" class="img"><div class="text2"> <b> $FILTER1_VALUE$</b>
</div><div class="text"> <b> $OTHER1$</b>
</div>
</a></div>
CSS
.image {
position:relative;
float:left; /* optional */
}
.image .img {
position:absolute;
top:-13px; /* in conjunction with left property, decides the text position */
right:-12px;
width:45px; /* optional, though better have one */}
.image .text {
position:absolute;
top:0px;
right:1px;
color: #000; }
.image .text2 {
position:absolute;
top:3px;
left:3px;
color: white;
letter-spacing: -1px;
background: rgb(0, 0, 0);
background: rgba(0, 0, 0, 0.7);}
.image a {text-decoration:none;}
.image a:hover {color:#FF00FF;}
现在我想这个形象: http://new-hard.do.am/movie/images/lb-movie-short-poster-hover.png到apear像悬停时,用户用鼠标在我的主图像..我不想要..这个图像取代我的主要图像只是为了出现在它上面 这个图像:
<img class="avkas rad2" src="$IMG_URL1$" width="130px">
答
您需要制作另一幅图像,然后将其悬停在此图像上方。然后
.image:link
{
background-image: "specify the path of the image";
}
.image:hover
{
background-image: "specify path of the image that you want to hover";
}
我试图.avkas:悬停{背景:网址(http://new-hard.do.am/movie/images/lb-movie-short-poster-hover.png); }但没有工作 – 2013-02-14 20:56:12