Avatar billede priestie Nybegynder
07. august 2003 - 03:29 Der er 26 kommentarer og
1 løsning

Preload af jpg animationer virker kun efter "tilbage"

Jeg har lavet dette script der preloader og kører billed-animationer. Dette virker ikke éfter hensigten når siden loades. Men hvis man følger et link fra siden, og klikker tilbage i browseren, fungerer det forrygende !?!

script:

<head >
<script language="JavaScript">
    function swaap(id){
        document.images[id].src=eval(id + '_cash[' + eval(id + '_cash.length-1') + ']').src;
    }
   
    function faade(id){
        swaapNwait(id, eval(id + '_cash.length-2'), eval(id + '_delay'));   
    }
   
    function load_images(id, pics, delay, prefix, postfix){       
        eval( id + '_cash=new Array()');
        eval(id + '_delay=' + delay);   
        for (i=0;i<pics;i++){
            eval(id + '_cash[' + i + ']=new Image()');
            eval(id + '_cash[' + i + '].src=\'' + prefix + id + '_' + i + postfix + '\'');           
        }
        document.images[id].src=eval(id + '_cash[0].src');       
    }   
   
      function swaapNwait(img, marker, delay){
        document.images[img].src=eval(img + '_cash[' + marker + ']').src;
        if (marker==0)
            return;
        marker--;            
        eval('setTimeout(\'swaapNwait("\'+img+\'", "\'+marker+\'")\', delay)');
    }   
</script>
</head>


Jeg preloader sådan:

<body bgcolor="#B4B4BF"  onload="
  load_images('profil_button', 5, 50, 'images/', '.jpg'),
load_images('projekter_button', 5, 50, 'images/', '.jpg'),
load_images('kontakt_button', 5, 50, 'images/', '.jpg'),
load_images('ressourcer_button', 5, 50, 'images/', '.jpg')" >


Jeg indsætter animationer sådan:

<img id="projekter_button" width="125" height="20" onmouseover="swaap('projekter_button')" onmouseout="faade('projekter_button')"


Jeg har studeret preloading i to dage (også på eksperten.dk), og jeg har prøvet MANGE løsninger, før jeg fandt ud af at det fungerede efter "tilbage" ...SURT!

mvh
søren
Avatar billede roenving Novice
07. august 2003 - 04:17 #1
Normalt ville man jo bruge ; mellem flere statements som skal kaldes af enfunktion som f.eks. onload, så det skulle du da prøve !-)

(I modsætning til , som bruges til at markere en liste som evalueres fra den ene ende til den anden -- lyder jo ikke som stor forskel, men måske ?-)

-- og så bruger du jo eval enormt meget - ovenikøbet nestet, så det kan jo være medvirkende til langsomheden ...

-- men med 20 pics skulle det jo ikke flytte sååå meget ...
Avatar billede priestie Nybegynder
07. august 2003 - 11:58 #2
Jeg har aldrig lave JS's før, så jeg har lånt lidt rundt omkring, brugt min fornuft og prøvet mig frem. Kommaer virker lige så godt som semicolon, men da semikolon åbenbart er kotyme, er det nu lavet om. Det ændrede dog ikke noget ved mit problem.

eval() er nødvendigt for at lave det generisk. Det er muligt jeg har brugt det mere end nødvendigt, men det er optimering, og det er ikke mit fokusområde lige nu.

Funktionerne bliver kørt ved start, da der er billeder på animationerne når siden har loadet, og da der ikke er angivet nogen "src" i <img>, burde det være bevis for at scriptet er kørt.
Avatar billede priestie Nybegynder
07. august 2003 - 12:00 #3
Her er lige et link: www.test.safeon.dk/index_.htm
Avatar billede roenving Novice
07. august 2003 - 14:23 #4
-- det ligner præcis nogle resultater, jeg har set før, og heller ikke forstået, så den vil jeg gerne være med til at finde ud af ...

En ide til et testhack:

en bittelille html-fil, åbnes som popup _efter_ preloaderen og lukker sig selv:

<html><head><title>Test</title></head><body onload="self.close()">Testing</body></html>

og så sidst i onload:

<body bgcolor="#B4B4BF"  onload="load_images('profil_button', 5, 50, 'images/', '.jpg');load_images('projekter_button', 5, 50, 'images/', '.jpg');load_images('kontakt_button', 5, 50, 'images/', '.jpg');
load_images('ressourcer_button', 5, 50, 'images/', '.jpg');window.open('test.html','Test')" >
Avatar billede priestie Nybegynder
07. august 2003 - 16:36 #5
Jeg hader hacks. Det er næsten det samme som at gi' op ;-)
Det burde kunne løses uden hack!

Skal pointene forhøjes for at kunne opnå en løsning?
Avatar billede roenving Novice
07. august 2003 - 16:48 #6
Det var et _test_hack !-)
Avatar billede priestie Nybegynder
07. august 2003 - 17:00 #7
okay, så :)
Jeg har testet test_hacket, men det har ikke hjulpet, tværtimod. Nu virker det heller ikke selvom man klikker på "Profil", og tilbage.
Mystisk.
Avatar billede roenving Novice
07. august 2003 - 17:07 #8
Ja, det vil jeg give dig helt ret i !-)

-- en, jeg ikke selv har nået at prøve, er at angive billedets størrelse i Image-constructoren -- fik lige ideen ved at læse lidt ,-)

altså i kort-form:

pic = new Image(123,456)
Avatar billede priestie Nybegynder
07. august 2003 - 18:07 #9
prøvet, men hjalp ikke....ØV!
Ellers tak!!
Avatar billede jytte Nybegynder
07. august 2003 - 18:16 #10
Jeg har lidt samme problemer.
Jeg tror nok jeg har fundet ud af
  1) at jeg ikke skal behøver preloade de billeder der skal vises til start
  2) at der ikke altid vises nogen billeder til start hvis der ikke står
    noget i img src.
  3) hvis den server billederne ligger på er lidt langsom leveres billederne
    tilsyneladende ikke hurtig nok selvom de er preloadet (aner ikke hvorfor)
Ved ikke om det hjalp noget, men du kan da prøve at sætte en src på dine image-tags
Avatar billede priestie Nybegynder
07. august 2003 - 20:09 #11
"src" hjælper ikke noget, desværre!

Jeg kan da ikke være den første med dette problem?!

Kan det foriøvrigt være et serverproblem? Jeg bruger Resin.
Avatar billede roenving Novice
07. august 2003 - 20:16 #12
Det kan faktisk godt være et server-problem ...

Se hvad der står i http-headeren:
Status 200/OK
Content-Type text/html 
Content-Length 3497 
Etag "AAAAPbdi+ZA" 
Expires Thu, 07 Aug 2003 17:20:40 GMT 
Last-Modified Thu, 07 Aug 2003 17:54:48 GMT

-- selvfølgelig expires, du skal lægge mærke til
Avatar billede roenving Novice
07. august 2003 - 20:18 #13
-- og jeg lavede en tvungen reload, så kom headeren til at se sådan ud:

Status 200/OK
Content-Type text/html 
Proxy-Connection close 
Content-Length 3497 
Server Resin/2.1.10 
Last-Modified Thu, 07 Aug 2003 17:54:48 GMT 
Etag "AAAAPbdi+ZA" 
Date Thu, 07 Aug 2003 17:22:55 GMT 
Connection close 
Expires Thu, 07 Aug 2003 17:23:00 GMT
Avatar billede jytte Nybegynder
07. august 2003 - 20:30 #14
jeg mente src="billednavn" (i tilfælde af at du troede src="")
Avatar billede priestie Nybegynder
07. august 2003 - 20:35 #15
jytte: Jeg er med på hvad du mener, men det virker desværre ikke!

roenving:
Jeg er ikke nogen http eller serverhaj, så jeg er ikke lige med på hvad alle de data i headeren helt præcist betyder.
Der kræves ikke licens til Resin (medmindre det er til kommercielt brug), så jeg forstår ikke rigtig!?!

Har du et forslag til en server du ved virker, hvor jeg lige kan teste det?
Avatar billede roenving Novice
07. august 2003 - 21:01 #16
Expires betyder at serveren har sendt browseren et direktiv om, at hvis den (browseren) skal forsøge at vise siden efter det tidspunkt skal den hente en ny udgave ...

Hvis du bruger Tilbage-knappen ignorerer browseren åbenbart dette ...

Måske er det pga. den forskel som fremgår af de to header-eksempler -- den første er nemlig efter at have brugt tilbage-knappen, og så har headeren åbenbart ikke en date-angivelse, som måske bliver bruges til sammenligning af Expires-tidspunktet.

Jeg ville ihvertfald prøve at kigge på indstillingsmulighederne i serveren for at finde ud af, hvilke header-indstillinger som man kan skrue på og hvordan !-)
Avatar billede priestie Nybegynder
07. august 2003 - 21:03 #17
okay, jeg kigger lige på det.
Det lyder som en plausibel forklaring!
Tak igen!
Avatar billede priestie Nybegynder
08. august 2003 - 01:06 #18
Nu har jeg prøvet at pille ved <cash> elementerne i configurationsfilen i Resin, men lige meget hjalp det. Jeg har efterfølgende prøvet med Jetty, Tomcat og Xerver. Kun Jetty kunne kører siden tilfredsstillende (=perfekt).
200p til roenving for indsatsen, og ledetråden.
Avatar billede priestie Nybegynder
08. august 2003 - 01:08 #19
hvordan er det lige man deler point ud?
Avatar billede roenving Novice
08. august 2003 - 01:14 #20
Ved at jeg lægger et svar !-)

Velbekomme '-)
Avatar billede jytte Nybegynder
08. august 2003 - 07:27 #21
>pristie:  ved du hvorfor det virker på Jetty ?
Avatar billede roenving Novice
08. august 2003 - 12:56 #22
>>jytte har du prøvet priesties metode (Tilbage-knappen), og har du checket hvilke header-informationer serveren har sat ...
Avatar billede jytte Nybegynder
08. august 2003 - 16:34 #23
>roenving:
hos mig virker det også efter jeg har trykket tilbage.

http://www24.brinkster.com/jytte/javascriptseks/skubbespil/pip/pipfugl.htm

Men hvordan er det lige jeg kan se hvad der står i http-headeren ?
Avatar billede roenving Novice
08. august 2003 - 16:41 #24
Jeg bruger IE-booster (www.paessler.com/iebooster) -- og jeg havde ingen problemer med dit spil ...

-- din header havde heller ikke en expires-value ...
Avatar billede roenving Novice
08. august 2003 - 18:55 #25
-- og tak for points ;~}
Avatar billede priestie Nybegynder
08. august 2003 - 19:05 #26
jytte:
Jeg ved faktisk ikke hvad det er ved Jetty der gør tricket, men det kører bare.
Det kan jo bare ikke passe at det ikke kan køre på Resin ?!?
Men lad nu det ligge.
Tak for jeres interresse!

priestie
Avatar billede jytte Nybegynder
08. august 2003 - 19:06 #27
Du kan godt gennemføre mit spil, men så du også over 50 billeder jeg bruger til at lukke lågen, for det gør jeg nemlig kun når jeg har brugt tilbage-knappen...
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester