a:hover trasparenza\opacità

[Chooboo]

Salve,
esiste un modo in CSS per rendere un link :hover trasparente?
nel senso che andando sopra col mouse si colora il background ma in modo trasparente, cioè che lascia scorgere l'immagine dello sfondo (magari poco).

grazie!

[roilld]

Per Mozilla "opacity" da 0 a 1 ad esempio

opacity:0.5;

poi per IE

filter:alpha(opacity=50);

i valori per IE vanno da 0 a 100.

[Mich_]

Attenzione che usando le opacity (nelle varie forme dialettali) si rende semitrasp. tutto il blocco, comprese le scritte.
Invece per rendere semitrasp solo lo sfondo si puo` agire con le immagini di sfondo: basta riempire con un'immagine intrinsecamente semitrasp. Si puo` realizzare tramite una .png (buon effetto ma necessita di filtri per IE), oppure una .gif (funziona anche in IE, ma utilizza la retinatura).

a {
  background: transparent none;
}
a:hover {
  background: transparent url(semitrasp.png);
}

[elisa21]

Originariamente inviato da Mich_
Attenzione che usando le opacity (nelle varie forme dialettali) si rende semitrasp. tutto il blocco, comprese le scritte.
Invece per rendere semitrasp solo lo sfondo si puo` agire con le immagini di sfondo: basta riempire con un'immagine intrinsecamente semitrasp. Si puo` realizzare tramite una .png (buon effetto ma necessita di filtri per IE), oppure una .gif (funziona anche in IE, ma utilizza la retinatura).

a {
  background: transparent none;
}
a:hover {
  background: transparent url(semitrasp.png);
}

ciao,
mi sono imbattuta anche io in questo 'problema', ho fatto vari tentativi con le opacity ma per motivi di tempo, per il momento, ho dovuto ripiegare sulle png.
Ho applicato la regola css che hai suggerito, ma ho una diversa visualizzazione tra FF e IE, ovvero in FF l'immagine png che va a 'colorare' lo sfondo risulta più bassa(di altezza) rispetto alla grandezza originale. Questo difetto, se così si può chiamare, si presenta solo con FF.
Da cosa può dipendere?
Grazie per l'aiuto,
elisa

[Mich_]

Originariamente inviato da elisa21
ciao,
mi sono imbattuta anche io in questo 'problema', ho fatto vari tentativi con le opacity ma per motivi di tempo, per il momento, ho dovuto ripiegare sulle png.
Ho applicato la regola css che hai suggerito, ma ho una diversa visualizzazione tra FF e IE, ovvero in FF l'immagine png che va a 'colorare' lo sfondo risulta più bassa(di altezza) rispetto alla grandezza originale. Questo difetto, se così si può chiamare, si presenta solo con FF.
Da cosa può dipendere?
Grazie per l'aiuto,
elisa

Cosi`, senza vedere il codice e` impossibile fare una diagnosi.
Puo` esserci un background-position
puo` esserci un errore di float/clear
o un qualsiasi altro problema di dimensioni del blocco.

Se puoi posta il link; altrimenti e` necessario conoscere:
- il codice HTML del blocco incriminato e del blocco contenitore; e se ci sono dipendenze da blocchi esterni anche il codice di quelli
- il codice CSS degli stessi blocchi
- il DOCTYPE usato
- in quali browser e versioni e` stato testato (in IE la visualizzazione cambia anche di molto a seconda della versione e della DTD)

[elisa21]

Originariamente inviato da Mich_
Cosi`, senza vedere il codice e` impossibile fare una diagnosi.
Puo` esserci un background-position
puo` esserci un errore di float/clear
o un qualsiasi altro problema di dimensioni del blocco.

Se puoi posta il link; altrimenti e` necessario conoscere:
- il codice HTML del blocco incriminato e del blocco contenitore; e se ci sono dipendenze da blocchi esterni anche il codice di quelli
- il codice CSS degli stessi blocchi
- il DOCTYPE usato
- in quali browser e versioni e` stato testato (in IE la visualizzazione cambia anche di molto a seconda della versione e della DTD)

giusto, scusami
nel frattempo ho verifiacto che era un'impostazione nel tag body che creava questa distorta visualizzazione solo su FF, quindi questo 'difetto' l'ho risolto.
Mentre per quanto riguarda i filtri da applicare per la gestione delle png su IE, sono ancora necessari oppure con le nuove versioni possono essere in qualche modo tralasciati?
Ti ringrazio tanto per l'aiuto,
elisa

[Mich_]

Mentre per quanto riguarda i filtri da applicare per la gestione delle png su IE, sono ancora necessari oppure con le nuove versioni possono essere in qualche modo tralasciati?

Dipende.
I browser recenti riconoscono le png correttamente.
Invece IE6 (e pare che ce ne siano ancora molti in giro) non riconosce le trasparenze eventualmente contenute.
Quindi, salvo che il tuo target di utenti non sia aggiornato, conviene inserire il filtro (eventualmente in un commento condizionale in modo da non creare errori/caricamenti inutili per gli altri browser ).