[JS]Fotoalbum wil niet lukken

[RvL]

Hallo allemaal,

ik ben bezig met een foto-album. Het moet dummy-geschikt zijn, dus ik zat te denken dat de gebruiker alleen de naam van de map met de foto's en thumbs in hoeft te voeren en om hoeveel foto's het gaat. Mits de bestandsnamen van de foto's en thumbs aan bepaalde eisen voldoen uiteraard.

Nu lukt het ophalen van de thumbs en het weergeven van de juiste foto goed. De thumbs worden echter weergegeven in een iframe, boven in beeld.

Standaard worden er 5 weergegeven. Als er nu meer thumbs in zitten dan 8 moet er dus een soort scrollfunctie komen. Dus niet gewoon het iframe scrollen, dat is niet wat ik bedoel. Het is de bedoeling dat, zodra er op de pijl naar rechts geklikt worden, de volgende thumb weergegeven wordt en de eerste uit de reeks vervalt (thumb 1 valt dus weg, thumb 2 wordt thumb 1 enz.). Dit lukt nog niet helemaal.

Ik doe het volgende. Zodra er op de pijl naar rechts geklikt wordt, wordt de volgende functie geladen:

JavaScript:

function nextThumb()
{
    //Eerste thumb die weergegeven wordt, + 1 voor de opvolger
    //van die thumb 
    intFirstThumb = intFirstThumb + 1;
    //integer intThumbNr en array arrThumbs aanmaken
    intThumbNr = 0;
    arrThumbs = new Array();
    
    //Array met filenamen thumbs vullen, arrThumbs
    //strMap wordt gevuld vanuit thumbs.htm, waar de functie wordt 
    //aangeroepen
    for(intThumb = intFirstThumb; intThumb <= (intFirstThumb+8); intThumb++)
    {
        //Als de filenaam van de thumb lager is dan 10, tn_09 b.v.
        //dan voorloop 0 erbij plaatsen
        if(intThumb < 10)
        {
            arrThumbs[intThumbNr+1] = strMap+"/thumbs/tn_0"+intThumb+".jpg";
        }
        
        //Anders geen voorloop 0 plaatsen
        if(intThumb >= 10)
        {
            arrThumbs[intThumbNr+1] = strMap+"/thumbs/tn_"+intThumb+".jpg";
        }
        
        //intThumbNr ophogen
        intThumbNr++;
    }
    
    //Nieuwe thumbs weergeven
    for(intLoop = 1; intLoop < 8; intLoop++)
    {
        //In thumbs.htm staan 5 images met de naam thumb1 t/m thumb5
        strThumb = "thumb"+intLoop;
        
        //sourcefile van de image aanpassen
        parent.scroll.document.images[strThumb].src = arrThumbs[intLoop];
    }

}

Het probleem doet zich voor in de laatste for-lus. Zodra het script hier aan komt krijg ik deze foutmelding:

code:

Error: parent.scroll.document.images[strThumb] has no properties

Het rare is dat Mozilla vervolgens wel de nieuwe thumbs weergeeft (de link wordt nog niet aangepast, dus dat werkt nog niet).

Internet Explorer doet dit niet en stopt gewoon met het uitvoeren van het script.

Het gaat dus met name fout bij parent.scroll.document.images[strThumb].src. Om heel precies te zijn bij strThumb, de string waarin de te veranderen image staat.

vervang ik het strThumb door de naam van de image, bijvoorbeeld parent.scroll.document.images['thumb1'].src, dan werkt het wel gewoon, maar dan wordt dus alleen thumb1 aangepast.

Wie o wie heeft hier een oplossing voor?

[ Voor 3% gewijzigd door RvL op 04-08-2004 22:05 ]

[crisp]

JavaScript:

for(intLoop = 1; intLoop < 8; intLoop++)
    {
        //In thumbs.htm staan 5 images met de naam thumb1 t/m thumb5

in thumbs.htm staan 5 images, maar je loop loopt door tot 7

[RvL]

Hoewel je helemaal gelijk hebt, schijnt het toch niet de oplossing te zijn, want ik krijg nog steeds de foutmelding.

het is toch gewoon mogelijk om een image in een frame aan te roepen, ookal haal je de naam de image uit een array? Want daar krijg ik keer op keer de foutmelding op.

[disjfa]

Ik ben nog altijd op zoek naar wat "parent.scroll" moet voorstellen. Vaak kom je met een andere benaming naar de daadwerkelijke pagina`s (parent.document.frames["framename"])

Maar heb je bij toeval een linkje van waar de code op staat. Daar kunnen we meer mee dan gissen naar wat er mogenlijk fout kan staan als je een scriptje aanroep.

edit:
@crisp: i know. korte notering en wat viezer, maar het zou idd wel kunnen. Maar dan nog is het wel handig te weten wat er daar allemaal staat

[ Voor 22% gewijzigd door disjfa op 04-08-2004 23:09 ]

[crisp]

parent.scroll is short voor parent.frames['scroll'] wat voor zover ik kan zien, en gezien het feit dat parent.scroll.document.images['thumb1'].src wel werkt gewoon goed is. De frames collectie is ook onderdeel van het window object en niet van het document object, document.frames[] is dus altijd fout.

je zou met een try-catch kunnen kijken waar het nou precies fout gaat:

JavaScript:

try {
  parent.scroll.document.images[strThumb].src = arrThumbs[intLoop];
} catch(e) { alert('Fout bij strThumb: '+strThumb); }

en btw, elke regel code van commentaar voorzien is een beetje teveel van het goede, ik zie zo ook wel wat de code doet. Verder verdient het aanbeveling variabelen te declareren met het 'var' keywoord - nu komen ze allemaal in de global namespace en dat wil je niet. eea kan ook een stuk korter en efficienter, zo kan je de 2 if's uit je 1e loop beter vervangen door een if - else (het kan zelfs in 1 regel, maar dat is misschien iets teveel van het goede )

[ Voor 84% gewijzigd door crisp op 04-08-2004 23:19 ]

[RvL]

Goed, ik heb even wat andere foto's er op gezet, want op de foto's waar ik mee bezig was stond ik nogal genant (lees: dronken ) op.

De link is http://home.planet.nl/~helamoen/photos/test.htm

Niet dat jullie daar niet achter kunnen komen maar bestanden die ook worden gebruikt:
thumbs.htm
system/scripts.js

Overigens, in Mozilla werkt het scrollen wel, maar ik pas alleen de thumb maar aan. De link dus nog niet, dus het klopt dat je een andere foto te zien krijgt dan op de thumb, als je er op klikt.

Dit geldt niet voor de thumbs die standaard geladen worden. En de layout is nog niets aan gedaan

Nog een toevoeging:
Als ik de try catch uitvoer dan geeft hij in IE al meteen bij strThumb == thumb1 een fout en gaat zo door t/m thumb5, de laatste thumb.

En warempel, in mozilla geeft hij geen fout meer nadat ik alle tellers goed gezet had. Daar werkt het nu dus. Maar in IE wil het niet werken op deze manier

[ Voor 55% gewijzigd door RvL op 05-08-2004 00:21 ]

[crisp]

waarom verwijs je eigenlijk naar parent.scroll als de images al in hetzelfde document staan als de functie die je aanroept?
en verder:

JavaScript:

document.writeln('<img src=\"'+strMap+'/thumbs/'+arrThumbs[intLoop]+'\" id=\"thumb'+intLoop+'\"\">');

je schrijft een " teveel op het eind, en je hoeft de dubbele quotes ook niet te escapen hoor

[RvL]

Ow god, je hebt he-le-maal gelijk, waar zat ik met mn hoofd....

Als ik het parent.scroll weghaal, werkt het wel gewoon....

Zo simpel, en ik doe er zo moeilijk over....

* RvL gaat in een donker hoekje zitten en schaamt zich