immagini che si "illuminano" al passaggio del mouse

[sdrol]

ciao a tutti,
ho bisogno di creare una cosa semplicissima per voi...
in pratica ho una pagina web in cui vengono visualizzate 2 fotografie! cosa voglio creare? vorrei che le foto vengano visualizzate leggermente "spente" e al momento che ci passo sopra il mouse si "illumini" l'uno o l'altra! ovviamente le foto hanno un loro reindirizzamento su altri link!

spero di essermi spiegato!

[ResianTaxidrive]

beh se non necessiti di effetti spaziali puoi mettere tramite css una opacity alle foto quando il mouse non ci passa sopra e la togli quando ci passa.

o altrimenti metti a un div come background-image la foto spenta, quando il mouse ci passa sopra cambi background-image e metti quella non spenta.

[sdrol]

avrei bisogno di sapere un po piu approfonditamente come fare... xD
la prima che hai detto è un po l'effetto che voglio creare!

[0-c00l]

Prova a scrivere nel css:

img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
-webkit-opacity: 0.5;
opacity: 0.5;
}

img:hover {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
-webkit-opacity: 0.9;
opacity: 0.9;
}

[sdrol]

è possibile invece fare un altra cosa:

>> in poche parole vorrei ottenere alla fin fine lo stesso effetto però ad esempio un immagine messa in una determinata posizione, al passaggio del mouse cambia posizione e diventa cliccabile<<

è possibile fare una cosa del genere? se è possibile mi potete dare un aiutino indicandomi come fare per ottenerla?

grazie

[0-c00l]

Se vuoi lasciare l' effetto precedente anche puoi fare così:

img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
-webkit-opacity: 0.5;
opacity: 0.5;
margin-top: 20px; /* E' un esempio margin-top, metti ciò che vuoi */
}

img:hover {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
-webkit-opacity: 0.9;
opacity: 0.9;
margin-top: 50px;
}

Però diventa incliccabile, ovvero se ci metti il puntatore scenderà a 50px, poi appena vai a cliccare il 50 togli il puntatore dall' area dell' immagine iniziale che torna a 20px..

[ResianTaxidrive]

Originariamente inviato da sdrol


>> in poche parole vorrei ottenere alla fin fine lo stesso effetto però ad esempio un immagine messa in una determinata posizione, al passaggio del mouse cambia posizione e diventa cliccabile<<

come sarebbe che cambia posizione? ti sfugge dal mouse?? in ogni caso basta che chiudi l'immagine in un tag a; se il mouse non è sopra cosa ti interessa che sia cliccabile o meno? il ragonamento mi pare contorto