[JavaScript][CSS][HTML]Płynne zmienianie tła diva Opcje

[Poczatkujacy_Web]

Witam,

Mam kod js, który zmienia mi tło diva o nazwie "foto", lecz robi to bez żadnego przejścia, oraz startuje bez żadnego tła,

chciałbym aby było jakieś delikatne przejście oraz aby tło startowało od pierszego zdjęcia.

niestety nie potrafię sam odpowiednio przerobić tego kodu

[HTML] pobierz, plaintext 
		<script type="text/javascript">
		window.addEventListener('load', function () {
var foto = document.getElementById("foto");
var bg = ['url(img/image1.jpg)', 'url(img/image2.jpg)', 'url(img/image3.jpg)', 'url(img/image4.jpg)'];
var czas = 5; // 5 sekund
var transition = 500;
 
var i = 0;
setInterval(function () {
i++;
i%=bg.length;
 
foto.style.backgroundImage = bg[i];
}, czas * 1000);
}, false);
</script>
 
[HTML] pobierz, plaintext 

Dodałem var transition = 500; ale co dalej?

Będę wdzięczny za pomoc. Pozdrawiam

Ten post edytował Poczatkujacy_Web 20.02.2014, 02:11:01

[Poczatkujacy_Web]

ogarnij sobie coś takiego:

[HTML] pobierz, plaintext 
img = new Image();
 
img.onload = function(){
  // image  has been loaded
};
 
img.src = image_url;
[HTML] pobierz, plaintext 

możesz mi powiedzieć w jakim celu?

Czy do tamtego kodu nie da się zastosować tego transition?