2015-06-23 27 views
0

嗨即時通訊要讓懸停效果在CSS觸發只有當鼠標在圖像上,而不是開始當它在這個圖像的div容器...鼠標只懸停在圖像的邊緣?

我該怎麼辦?

<div class="contenedor"> 
    <img class="encendido" src="foco_encendido.svg"> 
    <img class="apagado" src="foco_apagado.svg"> 
</div> 

.apagado 
{ 
    background: #333333; 
    width: 350px; 
    position: absolute; 
    margin: 0 0 0 5px; 
    bottom: 0px; 
} 
.contenedor 
{ 
    width: 360px; 
    height: 85%; 
    position: absolute; 
    left: 200px; 
    bottom: 0px; 
} 
.contenedor:hover img.apagado 
{ 
    visibility: hidden; 
} 
.encendido 
{ 
    width: 350px; 
    position: absolute; 
    margin: 0 0 0 5px; 
    bottom: 0px; 
} 
+1

然後使用:在IMG懸停代替。 –

回答

3

變化

.contenedor:hover img.apagado 
{ 
    visibility: hidden; 
} 

.apagado:hover 
{ 
    visibility: hidden; 
} 
+0

thanx爲答案我試過,但它的最壞的原因是每次鼠標移動圖像閃光..就像它的開啓和關閉......和唯一的方式,停止其放棄其他方式。 但我的問題不是我只是希望懸停效應運行在圖像邊緣而不是包含該圖像的div邊緣 – aleduque