CSS- link a un'icona visibile al volo di sole

Question

Ho un'icona che mostro in alto, a destra di un div al passaggio del mouse sul div. Il mio codice è simile a questo:

<div class='edit_hover_class'> 
    <!-- some code --> 
</div> 

e il file css corrispondente contiene:

.edit_hover_class:hover { 
    background: url("trash.gif") no-repeat scroll right top; 
} 

Voglio allegare un link per l'icona di modifica, è possibile con i CSS pianura? Se é cosi, come?

Answer 1

Si potrebbe nascondere un collegamento fino hover in questo modo:

<div class='edit_hover_class'> 
    <a href='#'><img src='icons/trash.gif' /></a> 
</div> 

.edit_hover_class a{ 
    visibility:hidden; 
} 
.edit_hover_class:hover a { 
visibility:visible; 
} 

See jsfiddle:

http://jsfiddle.net/Auzm5/

O se desideri solo l'icona di collegare, usare i CSS visibility:

http://jsfiddle.net/Auzm5/1/

Answer 2

I havent provato questo, ma la sua pena di provare:

HTML

<div class='edit_hover_class'> 
    <a href='#'><img src='icons/trash.gif' /></a> 
</div> 

CSS

.edit_hover_class a { 
    pointer-events: none; 
    cursor: default; 
} 

.edit_hover_class a:hover { 
    pointer-events: auto; 
    cursor: pointer; 
}