Změna obrázku se setměním

Spojením jednoduchého javascriptu a moderního CSS3 můžeme vytvořit efektní stmívací přechod:

Kód:

<img src=“starý obrázek“ id=“obrazek“ style=“transition:opacity 1s;-webkit-transition:opacity 1s“>

<span onclick=“document.getElementById(‚obrazek‘).style.opacity=0;setTimeout(function() { document.getElementById(‚obrazek‘).src=‘nový obrázek‚; document.getElementById(‚obrazek‘).style.opacity=1;  },1000)“>změnit obrázek</span>

Ukázka:

změnit obrázek