mały gif na czas ładowania grafiki

[thor_in]

Hej!

Wie ktoś może w jakiś sposób można wstawić mały gif na czas ładowania się grafiki?

Powiedzmy, że mam duże zdjęcie do załadowania na stronie co waży 500 kb. Chciałbym na czas jego ładowania wyświetlić na jego miejscu mały gif. Chodzi o to, a by nie wyświetlał się:

tylko np. jakiś ładny napis loading albo coś podobnego.

[Pavel]

https://weblog.404creative.com/2007/07/21/e...ading-with-css/

Mam coś takiego. Tutaj jednak widać jak obrazek się ładuje, i obrazek "Loading..." jest takiego samego rozmiaru co ładowany obrazek, ale może się przyda.

[yavaho]

IMG umieść w DIVie

A w DIVie daj animowany gif jako wyśrodkowane tło

[thor_in]

Dzięki Pavel za link do strony. Takie rozwiązanie może być. Na tej stronie z kolei podany jest link do www.ajaxload.info - bardzo przydatna sprawa.

[holee]

Takie rozwiązanie jednak idealne nie jest, ja poszukuje już od dłuższego czasu szukam czegoś takiego, z tym, że grafika główna jest pokazana na stronie dopiero po całkowitym jej załadowaniu, czyli nie pokazuje się po kawałku, lecz od razu.

I druga sprawa, że główne obrazki mogą mieć różną wielkość dlatego ciężko jest wyśrodkować ten loading.gif.

Jakby ktoś miał linka do jakiegoś rozwiązania to byłbym wdzięczny.

Pozdrawiam

[Pavel]

W takim razie może to:

https://jqueryfordesigners.com/image-loading/

a jeśli chodzi o wyśrodkowanie loading.gif to czy

background-position: center center;

nie załatwia sprawy?

[yavaho]

Pobierasz rozmiary obrazka w px funkcją getimagesize() dzieki temu możesz wyswietlić div w takich rozmiarach jak obrazek. I wtedy tylko wystarczy wysrodkowac loading.gif

W galerii jeżeli oglądanie w wiekszości polega na klikanie w next, to lepszym rozwiązaniem jest załadowanie nastepnego obrazka z wyprzedzeniem (a nawet kilku następnych obrazków) niż ciagle pokazywanie animowanego gifa i zmuszanie do czekania po kazdym kliknieciu.