Vai al contenuto

:hover con transazione css3


elias90

Messaggi raccomandati

Ragazzi stavo cercando sul web, un modo per creare una transazione con i css3 per l'hover, una transazione semplice effetto tipo sfumatura dall'immagine A -> B.

tipo le icone dei social network che trovate in alto a destra di questo sito, passandoci sopra il mouse ovviamente :D

sito esempio

sapete indicarmi qualche cosa? qualche tutorial o il modo per farlo?

Link al commento
Condividi su altri siti

Quella dell'esempio è una opacità e non uno scambio di immagini comandata da

#social-nav img {
   -moz-transition: opacity 0.3s ease 0s; opacity: 0;

Trovi una guida qui.

F.

ahhh, ok, a me servirebbe proprio uno scambio...c'è qualcosa del genere? ti spiego, io avrei 2 immagini una a colori e l'altra di default in b/n, al passaggio del mouse vorrei che cambiasse immagine (cosa che già fa) ma diciamo a modo di "dissolvenza" non so se mi sono spiegato bene...

questo è il sito che sto facendo, ancora da completare, se una volta caricato, notate le due colonne ai lati, vedrete che sono delle immagini in bianco e nero, e che passandoci il mouse si colorano, ma l'hover è orrendo, sparisce l'immagine e poi carica piano piano quella sotto, perchè? vorrei fare una cosa molto più carina...

Link al commento
Condividi su altri siti

Io con Opera non noto i problemi che dici tu, da b-n diventano a colori senza transizioni strane :)

eh si lo so perchè ho risolto in un'altro modo ieri sera e ho caricato in remoto ecco perchè ahah

Cerchi una cosa così?

link.

F.

Perfetto!! è prorpio quello che cercavo, mi interessa anche cosi in jquery, certo se era possibile in css3 era meglio, però va bene lo stesso ti ringrazio infinitamente!

Link al commento
Condividi su altri siti

Per il 99% si e per il restante 1% un po meno :) però non intendo certo mandarti sul serio... era solo un modo bonario per esprimerti il mio disappunto :)

capisco, ma se in un primo momento mi ritrovo il problema, cerco aiuto...in seguito posso risolverlo non credi? :ghghgh:

Link al commento
Condividi su altri siti

Archiviato

Questa discussione è archiviata e chiusa a future risposte.

×
×
  • Crea Nuovo...