Foto di sbiadimento in slideshow usando css

Question

Ho un sito Web e una presentazione di immagini sulla pagina principale.Prima che una foto viene rimossa, scrivo la foto successiva dietro di esso e poi rimuoverlo.Volevo sapere come posso aggiungere un effetto di sbiadimento prima che la foto venga rimossa.Il mio sito web è: guyzyl.org, quindi puoi controllare cosa sto parlando.Inoltre non so come usare jQuery, quindi per favore non offrire questa soluzione.Grazie per qualsiasi aiuto.Guy z.

Answer 1

.photo{
    -webkit-transition: opacity .5s ease-in-out;  /*Webkit*/
    -moz-transition: opacity .5s ease-in-out;  /*Firefox*/
    -o-transition: opacity .5s ease-in-out;  /*Opera*/
    transition: opacity .5s ease-in-out;  /*CSS3 Standard*/
    opacity: 1;
}
.photo.fade{
    opacity: 0;
}

document.querySelector(".photo").classList.add("fade");

.

Vedi demo: http://jsfiddle.net/Derekl/jzlzz/