Доброго времени суток! Подскажите, как в css применять hover эффект к png изображениям.
Например, есть два изображения html:
CODE ( html):
скопировать код в буфер обмена
<div class="m"> <a href="" target="" title=""><img src="images/kapot.png" class="kapot" border="0"></a> <a href="" target="" title=""><img src="images/krilo.png" class="krilo" border="0"></a> </div>
css:
CODE ( htmlphp):
скопировать код в буфер обмена
.m img {opacity:0;} .m img:hover {opacity:1;} .m img {position:absolute;} .kapot {margin: 137px 0 0 82px;} .krilo {margin: 155px 0 0 380px;}
Здесь при наведение на изображение, может случится такое, что мышь попадает в невидимую область и подсвечивается не то изображение.
Есть ли какое-нибудь решение?
p.s. Например, для появления тени в png изображении используется:
здесь у изображения тень пойдет по граням, а не по прямоугольнику..
|