Vstopna stran, 3 slike fade in

Na vstopni strani bi imel raje namesto sliderja 3 fotografije.. Eno polek druge..

Ne vem kako je najbolje narediti efekt, da se ob obisku strani prikaže najprej leva, potem sredinska in potem desna.. Nek fade in efekt.

Je najbolje to naredit z jQuery?

Prosil bi tudi za kak primer, hvala lepa, lp.

3 odgovori

v teoriji nebi rabil jqueryja in bi lahko naredil s css transitioni... ampak ker gre za slike, moras biti siguren, da so prej loadane, potem lahko izvedes efekt... tako da ja, priporocam jquery...

efekt pa lahko naredis preprosto...

najprej poskrbi, da so img placeholderji v DOMu istih dimenzij kot koncna slika in da zavzemajo dejansko prostor na strani a se vendo skriti... torej ne proabit display:none ampak visibility: hidden in hard coded width in height...

potem poglej za resitvijo, kdaj se trigga event ko so vse tri slike loaded...

pol pa das normalno fadein za vse slike... s tem da jih das v nek interval 300ms..(prva koj, druga cez 300ms tretja pa cez 600ms). efekt fadein pa naj traja 400ms....kar bo pomenilo, da se bo srednja slika zacela prikazovati se predno bo prva fully shown... in zadnja isto...preden bo druga do konca

pol se pa samo igras z intervali, da dosezes desired efekt ;)

good luck

4

super, thanks!

potem poglej za resitvijo, kdaj se trigga event ko so vse tri slike loaded...

Te lahko za to prosim za kak napotek? Je to function ready?

Drugače pa super, precej podobno sem si tud sam zamislil.

wssrpnc:
Te lahko za to prosim za kak napotek? Je to function ready?

github.com...imagesloaded
github.com...waitForImages

StackOverflow vprasanje na to temo

2