[HTML][JavaScript]Płynne przejście zdjęć Opcje

[Kloc]

Siemanko, jak mogę uzyskać efekt płynnego przejścia pomiędzy obrazkami w galerii na stronie, bo po wgraniu na serwer ma efekt "przycinania" się?
Za zmianę odpowiada js, po wywołaniu funkcji onclick="change()".

[HTML] pobierz, plaintext 
background = new Array();
background[0] = 'obrazek.jpg';
background[1] = 'obrazek2.jpg'';
background[2] = 'obrazek3.jpg'';
background[3] = 'obrazek4.jpg'';
 
function change() {
	val = document.getElementById('ksztalt6');
	value = val.getAttribute('data-value');
	if(value < background.length - 1){
		id = ++value
		document.getElementById("ksztalt6").setAttribute('data-value', id);
	}
 
	else{
		document.getElementById("ksztalt6").setAttribute('data-value', 0);
	}
}
 
function show() {
	val = document.getElementById('ksztalt6');
	id = val.getAttribute('data-value');
	document.getElementById("top").style.backgroundImage  = 'url('+background[id]+')';
	document.getElementById("top").style.transition  = 'background-image 2s 0s';
}
[HTML] pobierz, plaintext 

Ten post edytował Kloc 25.06.2014, 13:01:22

[PrinceOfPersia]

możesz na początku dla każdego obrazka w background stworzyć nowy obiekt Image, cos takiego:

[JAVASCRIPT] pobierz, plaintext 
background.forEach(function(src) {
  var img = new Image;
  img.src = src;
});
[JAVASCRIPT] pobierz, plaintext 

to powinno ci załadować do cache przeglądarki dany obrazek, i tym sposobem szybciej będzie się ładował pozniej (ale zobacz, czy to jest o co ci chodzi)

edit:
tam dwa apostrofy masz niepotrzebnie:

[JAVASCRIPT] pobierz, plaintext 
background[3] = 'obrazek4.jpg''
[JAVASCRIPT] pobierz, plaintext 

az dziwne, że ci to działa, bo powinien krzyknąć błąd składni

Ten post edytował PrinceOfPersia 25.06.2014, 14:04:42