Effetto Immagine Sul Passaggio Del Mouse

lalexgraphics

Effetto Immagine Sul Passaggio Del Mouse

Come posso ottenere in wordpress l'effetto su un immaggine al passaggio del mouse , ad esempio l'abbassamento dell'opacità o viceversa .
Esiste qualche plugin ?

mtdev2

Si ottengono facilmente in CSS, senza la necessità di plugin.
Apri il foglio di stile del tuo tema (style.css di solito) e apporta le modifiche, ti basta aggiungere ad esempio:


img:hover { 
opacity: 0.5; 
}

lalexgraphics

Ho trovato un codice html per creare un effetto opacità sull'immagine e quando passo con il mouse diventa normale :

<img style="opacity:0.4;filter:alpha(opacity=40)" onmouseover="this.style.opacity=1.0;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" src="URL DELLA IMMAGINE"/>

Se creo un collegamento ad un sito , quando passo sopra con il mouse ,l'immagine rimane nella versione normale e non con l'opacità come mai ?

mtdev2

Non so, forse non rileva il passaggio perchè contenuto in un link (tag a). In questo caso dovresti spostare tutti i "codici" su quel tag.

Ti rifaccio notare che in CSS puoi ottenere esattamente lo stesso effetto con pochissime righe. Non ho fatto dei test, ma anche gli eventi dovrebbero essere più reattivi in CSS.

lalexgraphics

Questo codice funziona ma mi servirebbe il codice html che apre il link in una nuova finestra
[HTML]<a class="trasparenza" href="indirizzo da raggiungere"><img src="URL DELLA IMMAGINE" alt="testo alternativo" /></a>[/HTML]

E il css dove lo posiziono?
[HTML]<style type="text/css"> </style>[/HTML]