Witam, stosuje biblioteke https://daneden.github.io/animate.css/
i chce stworzyc plynne przejscie pomiedzy jednym zdjeciem a drugim.

W chwili obecnej robie to za pomoca js'a i przez ulamek sekundy przejscie nie jest plynne.

[PHP] pobierz, plaintext 
			$$('#story-image').html("<img src='img/story/"+wygrane_uzytkownik+".png' width='100%' class='animated pulse'>");
[PHP] pobierz, plaintext 

W ten sposob wczytuje kolejne zdjecie.
Licze na wasza pomoc

Najpierw poczekaj aż się obrazek wczytaj, wtedy dodawaj mu klasy.
Animacja startuje w momencie kiedy element (w tym przypadku obrazek) jest dodany do drzewa DOM, a nie kiedy się załaduje.

Tak, to jedna sprawa, ale druga jest taka ze nawet jesli obrazki sa juz zaladowane, w czasie ich podmiany nastepuje na ulamek sekundy ich brak.

Pokaż więc kod z preloaderem.

Chodzi o to ze $().html podmienia dany element, ale pomiedzy ta podmiana element znika zeby mogl sie pojawic kolejny, chce to zniwelowac bo moj tekst pod obrazkami na ulamek sekundy pojawia sie w miejscu gdzie bedzie kolejny obrazek po czym spada na dol(tekst). To naprawde krotki moment, aczkolwiek wkurzajacy.

Spowodowane jest to tym, ze obrazek nie ma na stale przydzielonych parametrow width i height, ale ze jest to strona mobilna to nie moge ich sztywno przydzielic.

Jeszcze raz więc.
Klasy animated i pulse powinieneś dodać po załadowaniu obrazka. Użycie metody html to tylko dodanie obrazka do drzewa DOM. Po dodaniu powinieneś poczekać na załadowanie i wtedy dodać powyższe klasy.

Tak tez zrobilem:

[PHP] pobierz, plaintext 
			$$('#story-image').html("<img src='img/story/"+wygrane_uzytkownik+".png' width='100%' class='test'>");
			$$('.test').addClass('animated fadeIn');
[PHP] pobierz, plaintext 

Nie rozwiazuje to mojego problemu :/

https://www.google.com/search?q=javascript+preload+image

Umiem uzywac google

Nawet jesli podmieniam obrazek na ten sam, to dzieje sie to samo, wiec to nie jest kwestia preloadingu.

Wrzuć przykład na jsfiddle.net