Ajax bildes maiņa

[Stopp]

Kā varētu izdarīt tā, lai, kad es nospiežu pogu, tad nomainas viena bilde, bet, kamēr tā bilde vēl nav ielādējusies, tikmēr tās bildes vietā rādas kaut kāda loading bilde.

 

Nesaprotu, kā lai es noskaidroju, kad bilde ir ielādējusies. Ar ajaxu es laikam varēšu izdabūt tikai tekstu laukā no kāda faila, bet kā ar bildēm?

[andrisp]

Viens varētu būt izmantojot onload. Sīkumos neizplūdīšu, jo pats neesmu mēģinājis, bet doma tāda:

 

- Ar JS ievietojam DOM kokā to loading attēlu. Atceramies referenci uz to.

- Ievietojam DOM saturā tavu attēlu. Piekabinam klāt tam onload eventu, kas, kad bilde būs pabeigusi lādēties, paslēps (vai izņems no DOM) loading attēlu. Vajadzētu tikai izdomāt kā darīt, lai nerādītos pusielādēts fails.

 

Var vēl mēģināt arī ar JS priekšielādēt (preload) attēlu. Pagūglē uz javascript image preloading vai kaut ko tādu.

 

Bet gan jau kāds, kas tiešām ar to būs darījies, zinas precīzāku atbildi ;).

[rpr]

prieksh tam ir events onreadystatechange

[andrisp]

rpr, onreadystatechange status 4 (pabeigts) ieslēgsies, kad būs savākts markaps, nevis kad būs ielādējusies bilde. Palabojiet, ja maldos.

[bubu]

Vajag darīt tā kā andrisp stāšta.

Vajadzētu tikai izdomāt kā darīt, lai nerādītos pusielādēts fails.

Vienkārši - display: none;

[andrisp]

Bet vai nav tā, ka browseris nelādē failus, kam ir display: none ?

 

Domāju, ka tu visu vajag apvienot ar image preloading.

 

1) Ievietojam loading attēlu,

2) Pieprasam ielādējamās bildes nosaukumu,

3) Ar JS preloadējam šo attēlu,

4) Izņemam loading, ievietojam attēlu.

 

Ja JS tiešām ir stricti lineārs, tad vajadzētu strādāt.

Edited December 6, 2006 by andrisp

[GedroX]

Ajax te toč nav nepieciešams. andrisp praktiski visu arī izstāstīja. Vienīgi:

 

Vajadzētu tikai izdomāt kā darīt, lai nerādītos pusielādēts fails.

 

Attēlam jāuzliek style="visibility: none;" un pie ielādēšanās visibility: visible.. Loader attēlu var vienkārši iegrūzt backgroundā, lai nevajadzētu lieki slēpt/ rādīt.

 

Bet vai nav tā, ka browseris nelādē failus, kam ir display: none ?

 

Man liekās, ka jā. Tādēļ visibility: hidden;. Vai arī sliktākajā gadījumā - position: absolute; top: -1000px; =)

[rpr]

panjem atrodi kaadu webu kur mainaas menu bildes un iecheko kaa taas bildes tiek prelodotas. adobes driimviivers taadus tipiskus preloderus taisiija.

[andrisp]

Var jau vēl vienkāršāk: http://www.google.lv/search?hl=lv&q=ja...mage+preloading ;)

[Stopp]

Nuu, preloads, paldies nē. Ja tas man būtu pieņemams, būtu taisījis tā. Nav preloadings grūts.

 

Paldies par labajām idejām, šis tas ienāca prātā, uz tām paskatoties :)

 

Bet vai nav tā, ka browseris nelādē failus, kam ir display: none ?

Vismaz ielādē tad, ja viņš ir div/span-ā, kam ir display: none. Ar to pietiek.

[andrisp]

Kas vainas bildes preloadēšanai ? Es jau nedomāju visas bildes, bet tikai to vienu, kas jāparāda.

[Stopp]

Aber tur var kopā lapas lietotājs daudzs bildes mainīt, tikpat labi var nevienu, kā nu viņš spiež pogas ;) Serveris lēns, tāpēc maksimāli maz datus vajadzētu pie lapas ielādes lādēt.

[andrisp]

Tāpat nesapratu, kas tur slikts, ja tu ielādē bildi ar JS, un tikai tad ievieto viņu iekš DOM. Un jau teicu, ka to domāju tā, ka tikai pa viena bildei preloadēt - un preloadēt tikai tāpēc, lai nebūtu jāskatās uz bildes ielādes procesu. Bet vispār bez tā arī var iztikt, jo GedroX jau teica, ka elements ar visibilty: hidden arī tiek ielādēts.

[Stopp]

Ja nemaldos, tad tas aizpilda lapu ar tukšu vietu tur, kur viņam būtu jābūt redzamam, tāpēc visibility ar nelietošu. Nu, hmm, pamēģināšu tagad uztaisīt to savu ideju, ja nesanāks, tad kaut kam citam pieskaršos.

[andrisp]

Ja tik ļoti tev nepatīk preloadings, tad vēl vari mēģināt to attēlu lādēšanas laikā pozicionēt absolūti ar left: -1000; vai kaut ko tādu. Un tad uz onload evenu, nolikt normāli (noņemt position: absolute; un left: -1000; ).