[JS] DIR met foto's preloaden...

[Verwijderd]

Hallo,

Momenteel heb ik een pagina gemaakt met daarin een I-frame. In het I-frame worden foto's weergegeven. (+/- 40 stuks)
De basis pagina blijft dus steeds hetzelfde, want de pagina's in het I-frame veranderen alleen.

D.m.v deze code kun je een foto laden:
<script language="JavaScript">
newImg = new Image();
newImg.src = "plaatje.jpeg";
</script>

Maar nu is mijn vraag;
-Kun je ook een hele DIR met foto's laden?

-En kun je een duidelijke scheiding in de pagina maken, zodat EERST de basis pagina geladen word en daarna het preloaden begint?

(Dit om te voorkomen dat de basis pagina een lange laadtijd krijgt.)

Alvast bedankt voor de hulp

[crisp]

je 1e vraag: javascript kan geen directories op de server uitlezen; als je alle plaatjes uit een dir wilt preloaden zal je dus met een serverside scriptingtaal de directory moeten uitlezen en de benodigde javascript naar de client sturen (per plaatje een stukje script dus).
je 2e vraag: ja, je kan het preloaden beginnen nadat de pagina zelf volledig geladen is: zet je preloadcode in een functie die je onload aanroept.

[André]

Wat misschien ook makkelijk is als antwoord op je eerste vraag: zorg dat alle plaatjes dezelfde naam hebben met 1 verschil: een nummer er achter.

plaatje001.gif, plaatje002.gif, plaatje003.gif.....enz

Dan hoef je in je script alleen maar aan te geven hoeveel plaatjes je hebt en de rest doet het script zelf.

[Verwijderd]

De foto's hebben inderdaad een logische volgorde, namelijk 01.jpeg, 02.jpeg.

Heb je misschien een voorbeeld scriptje?

Of een link naar meer info..

[ Voor 15% gewijzigd door Verwijderd op 11-07-2003 13:44 ]

[André]

Even uit mijn hoofd:

JavaScript:

AantalPlaatjes = 10;
Plaatje = new Array();

for (i = 0; i < AantalPlaatjes; i++)
{
  Plaatje[i] = new Image();
  if (i < 10) { Plaatje[i].src = "0" + i + ".jpeg"; }
  else  { Plaatje[i].src = i + ".jpeg"; }

}

Zoiets moet het worden denk ik.

[Verwijderd]

Als de webserver direcory-listing aan heeft staan zou je via een hidden frame alle plaatjes in de directory kunnen uitlezen met javascript.

[André]

Verwijderd schreef op 11 juli 2003 @ 13:56:
Als de webserver direcory-listing aan heeft staan zou je via een hidden frame alle plaatjes in de directory kunnen uitlezen met javascript.

Dan zou je dus met js die pagina moeten parsen, is wel een hele vieze oplossing.

[Verwijderd]

moet ik op de plaats van "Plaatje" de file naam zetten... ben nog onhandig met JS

[Verwijderd]

Dit is wat het momenteel is: Alleen de eerste 5 foto's werken nog maar en de BACK buttons werken nog niet!

http://members.lycos.nl/d...ersee/2003_worthersee.htm

Is preloaden nodig of is het snel genoeg?

[André]

Preloaden is nodig (werk hier met modem).

En nee, Plaatje is gewoon de naam van de array waar de plaatjes in gezet worden.

[Verwijderd]

dus het script zoals hierboven zo werken met mijn files? En hoe kun je eigenlijk testen of een preload code werkt? Het werkt namelijk op de achtergrond.

Edit: Ik heb nog iets gevonden..

plaatje = new Array( '1.gif' , '2.gif' , '3.gif' , '4.gif' , '5.gif' , '6.gif')

[ Voor 29% gewijzigd door Verwijderd op 11-07-2003 14:23 ]

[André]

Verwijderd schreef op 11 July 2003 @ 14:17:
dus het script zoals hierboven zo werken met mijn files? En hoe kun je eigenlijk testen of een preload code werkt? Het werkt namelijk op de achtergrond.

Edit: Ik heb nog iets gevonden..

plaatje = new Array( '1.gif' , '2.gif' , '3.gif' , '4.gif' , '5.gif' , '6.gif')

Het script zou moeten werken met plaatjes die in dezelfde dir staan met een naam die begint met 2 cijfers en van 00 naar 01 naar 02 enz lopen. En met AantalPlaatjes geef je aan hoeveel er dan zijn.

En aan de snelheid van dat 'volgende' knopje kun je zien of de plaatjes ook echt gepreload zijn.

[Verwijderd]

Kun je dan ff kijken naar die link, de code zit erin (met 56K).
Nu zouden de eerste 10 grote foto's 500*375 ge'preload moeten zijn. Kijk maar eens in de source code. (thx)

[André]

oke, moment....
welke link bedoel je nu?

Maar daar staat het script nog niet? vergeten up te loaden misschien?

[ Voor 95% gewijzigd door André op 11-07-2003 14:46 ]

[Verwijderd]

http://members.lycos.nl/d...ersee/2003_worthersee.htm

[André]

Volgens mij bedoelde je deze url:
http://members.lycos.nl/d...ersee/2003_worthersee2.htm

Probeer dit eens:

HTML:

<html>
  <head>
    <title>Test</title>
    <script language="javascript">
      AantalPlaatjes = 14;
      Plaatje = new Array();
      Dir = "http://members.lycos.nl/dtmclip/2003_worthersee/";
      ActievePlaatje = 0;

      for (i = 0; i < AantalPlaatjes; i++)
      {
        Plaatje[i] = new Image();
        if (i < 10) { Plaatje[i].src = Dir + "0" + (i + 1) + ".jpg"; }
        else { Plaatje[i].src = Dir + (i + 1) + ".jpg"; }
      }

      function ZetPlaatje(nr)
      {
        ActievePlaatje += nr;
        if (ActievePlaatje > Plaatje.length - 1) { ActievePlaatje = 0; } 
        if (ActievePlaatje < 0) { ActievePlaatje = Plaatje.length - 1; } 
        document.images['ViewPlaatje'].src = Plaatje[ActievePlaatje].src;
      }
    </script>
  </head>
  <body>
    <center>
    [img]"http://members.lycos.nl/dtmclip/2003_worthersee/01.jpg">
[/img]
    <input type="button" value="<==" onclick="ZetPlaatje(-1)">
    <input type="button" value="==>" onclick="ZetPlaatje(1)">
  </body>
</html>

[Verwijderd]

Hey André,

ben net terug van mijn werk, ik heb het geprobeerd...het werk perfect. Maar het duurt wel ff voordat je op de "back" en "next" kunt drukken. Wel veel beter dan elke keer bij een nieuwe foto wachten.

Nu nog zaterdag of zondag in de goede layout plaatsen en dat ben ik READY.

Bedankt voor de hulp, zal ik je via de mail het resultaat laten zien als ik klaar ben?

[André]

Verwijderd schreef op 12 July 2003 @ 00:47:
Hey André,

ben net terug van mijn werk, ik heb het geprobeerd...het werk perfect. Maar het duurt wel ff voordat je op de "back" en "next" kunt drukken. Wel veel beter dan elke keer bij een nieuwe foto wachten.

Nu nog zaterdag of zondag in de goede layout plaatsen en dat ben ik READY.

Bedankt voor de hulp, zal ik je via de mail het resultaat laten zien als ik klaar ben?

offtopic:
Ik heb je op msn toegevoegd, stuur daar die url maar.