Onko mahdollista saada nettisivuilla kuvia latautumaan koneen välimuistiin ilman että kuvan tarvitsee näkyä sivuilla? Tarvitsisin tätä koska olen javascriptillä toteuttanut puhelimen vaihdon http://3g.kiinnostaa.com sivuille, mutta tämä kuvan päivitys toimii viiveellä. Tai jos on muita vaihtoehtoja kuvan vaihtumisen nopeuttamiseen, olisin kiitollinen kuulemaan niitä.
JavaScriptillä ainakin onnistuu kuvien lataus etukäteen (Google: javascript image preload tms) ja toinen vaihtoehto on läiskäistä kuvat normaalisti img-tageilla sivulle ja piilottaa halutut kuvat CSS:llä (display: none).
Kiitoksia, pitää tutustua noihin javascriptin mahollisuuksiin:P
Tällaisen sain tehtyä, mutta ei tunnu toimivan kuin Operalla:(
function preloader(){
// counter
var i = 0;
// create object
imageObj = new Image();
// start preloading
for(i=0; i < kuva.length; i++){
imageObj.src=kuva[i];
}
}Ja liitin sivuille näin:
<body onLoad="vaihdaKuva(); preloader();">
Tuo toinen ratkaisu on todennäköisesti varmempi ja paremmin toimiva, eli CSS:llä piiloon vain.
Ja kun CSS on pois käytöstä, kaikki kuvat näkyy. Tässä tapauksessa JavaScript on minusta se parempi ratkasu.
Kyllä tosiaan mielummin tota JavaScriptiä käyttäisin, jottei kuvat näkyisi jos CSS ei käytössä. Lisäksi noiden kuvien näkyvyys on jo ennestään JavaScripitistä riippuvainen.
Eiköhän CSS ole nykyaikaisilla selaimilla käytössä useammin kuin javascript? Olettaen että IE 6 ei bugita pahasti noin yksinkertaisten muotoilujen kanssa.
Heikki kirjoitti:
Eiköhän CSS ole nykyaikaisilla selaimilla käytössä useammin kuin javascript? Olettaen että IE 6 ei bugita pahasti noin yksinkertaisten muotoilujen kanssa.
Mutta eikös tässä tapauksessa CSS-kikkailun kanssa sivu näy pahasti väärin kun se ei ole käytössä? Mutta toisaalta jos JS ei ole käytössä niin se aiheuttaa vain preloaderin toimimattomuuden, sivut näkyvät muuten oikein.
Tai no, kaikkien kuvien näkyminen yhdellä sivulla ei liene kovin paha virhe (varsinkin kun sivu tuskin on muutenkaan mikään kauneuden riemuvoitto kun CSS on poissa käytöstä). Mutta periaatteessa.
Onko muuten varma että tuo CSS display none todella latauttaa sen kuvan kaikilla selaimilla? Joskus mielestäni tutkailin asiaa, ja tulin tulokseen että sen toimivuus koko selainkaartilla oli jokseenkin puutteellista. Samoin useimmat selaimet taitavat ladata esiladattavat kuvat samalla prioriteetilla kuin muutkin kuvat; koko muunkin sivun lataus hidastuu kenties hyvinkin radikaalisti. JS:llä taas on mahdollista toteuttaa se niin että se skripti ajetaan vasta kun sivu on latautunut (onload-tapahtuma).
Tuola onkin aiheesta enemmän asiaa:
http://www.biomi.org/blogi/2005/11/
No taas sitä oppi uutta :) Eli JavaScriptiä käyttöön.
Voihan kuvien width ja height arvot laittaa vaikka yhden pikselin kokoisiksi, jolloin niitä ei paljon huomaa, vaan XHTML ei kait sulata tyylimääreitä tageissa, korjatkaa jos olen väärässä.
Osaako kukaan sanoa tuosta aikaisemmin kirjoittamastani koodista, että mikähän siinä olisi vikana kun tuntuu toimivan vain Operalla?
Jaa-a, onhan "kuva" varmasti globaali muuttuja?
JTS kirjoitti:
Jaa-a, onhan "kuva" varmasti globaali muuttuja?
Kyllä ainakin pitäisi olla, sillä muut scriptit toimivat käyttämällä "kuva" muuttujaa. Eli kuvaa ei ole määritetty funktion sisällä, eli eikö sen tällöin pitäisi olla globaali?
Pitäisi joo. Missä muodossa sitten kuvien osoite on? Koko url vai vain paikallinen nimi? Jos paikallinen nimi, niin voisit kokeilla täydellisellä urlilla varustettuna.
JTS kirjoitti:
Pitäisi joo. Missä muodossa sitten kuvien osoite on? Koko url vai vain paikallinen nimi? Jos paikallinen nimi, niin voisit kokeilla täydellisellä urlilla varustettuna.
Paikallinen nimi on, mutta en uskoisi tällä olevan merkitystä, sillä sama taulukko toimii hyvin kuvaa muuten vaihdettaessa. Ainoastaan tuossa esilatauksessa ei toimi.
EDIT: kokeilin vielä tätä niin ei sekään auttanut.
Kokeilin tuota vielä kännykällä (6630, Opera) ja tälläkin yhdistelmällä toimii hyvin.. Olisikohan sitten tuossa silmukassa jotain et Firefox ja IE ei suostu lataamaan kuvia silmukassa?
EDIT: Noniin sain vihdoinkin toimimaan, kun muutin myös imageObj taulukoksi, jolloin saman imageObj lähdettä ei päivitetty uudelleen joka kerta.
Aihe on jo aika vanha, joten et voi enää vastata siihen.