[HTML/JS] Simpel fotoboek - Softwareontwikkeling

dinsdag 6 april 2004 01:09

Acties:

Topicstarter

probleemsite: http://members.home.nl/noto/test.htm
en een variant: http://members.home.nl/noto/test2.htm

Ik heb wat problemen met de pagina die hierboven staat. Ik heb 3 foto's staan in de map dog: 1.jpg, 2.jpg, en 3.jpg

Bedoeling is dat door het drukken op een knop de volgende foto getoond word in een iframe (liever zonder iframe, als 't maar werkt). De naam van de foto moet als variabele gebruikt kunnen worden zodat ik voor mijn part tot foto 500 kan gaan... hoe krijg ik dit aan de praat?

Waarschijnlijk een makkelijke oplossing, maar naar een dag googlen wil het me nog niet lukken. vandaar dat ik hier maar eens vraag

wat ik tot nu toe heb (test.htm):

code:

<html>
  <head>
    <title>
      Picture
    </title>
    <link href='script/style.css' rel='stylesheet' type='text/css'> 
    <script language="JavaScript">

       var naam = 1
       var dir = dog


       function nummerplusmin(bla)
       {
       naam = naam + bla;
       vernieuwpic(naam);
       }

       function vernieuwpic(nummer)
       {
     document.frames[0].document.open('images/pictures/'+ dir +'/'+ nummer +'.jpg');
       }

     </script>
  </head>
  <body>
    <center>
        <iframe name="iframe" src="images/pictures/dog/1.jpg" width="100%" height="200" frameborder="0">
            <b>test frame</b>
        </iframe>
      <FORM> 
         <INPUT TYPE="button" VALUE="<<" onclick='nummerplusmin(1)'> 
         <INPUT TYPE="button" VALUE=">>" onclick='nummerplusmin(-1)'> 
      </FORM> 
    </center>
  </body>
</html>

dude... wait... what...

dinsdag 6 april 2004 01:13

Acties:

Vampier

poke-1,170

gebruik div en innerHTML

dinsdag 6 april 2004 01:15

Acties:

.oisyn

Moderator Devschuur®

Demotivational Speaker

Hoi

*!*!* Over topictitels in P&W - Updated 25 feb 04 *!*!*
P&W FAQ - HTML / javascript / css, etc...

Zoals je kunt zien hoort html en javascript bij onze buren in Webdesign & Graphics. Ik schop 'm even daarnaartoe

Give a man a game and he'll have fun for a day. Teach a man to make games and he'll never have fun again.

dinsdag 6 april 2004 01:17

Acties:

NoTo

Topicstarter

sure

thanx, had ik niet gezien

dude... wait... what...

dinsdag 6 april 2004 01:32

Acties:

KompjoeFriek

Statsidioot

probeer dit eens

code:

<html>
  <head>
    <title>
      Picture
    </title>
    <link href='script/style.css' rel='stylesheet' type='text/css'> 
    <script language="JavaScript">

       var naam = 1
       var dir = "dog"

       function nummerplusmin(bla)
       {
         naam = naam + bla;
         vernieuwpic(naam);
       }

       function vernieuwpic(nummer)
       {
         divje = document.getElementById("foto");
         divje.innerHTML = "<img src='images/pictures/"+ dir +"/"+
          nummer +".jpg'>";
       }

     </script>
  </head>
  <body onLoad="nummerplusmin(0)">
    <center>
      <FORM> 
         <INPUT TYPE="button" VALUE="<<" onclick='nummerplusmin(-1)'> 
         <INPUT TYPE="button" VALUE=">>" onclick='nummerplusmin(1)'> 
      </FORM> 
      <div id="foto">[img]""></div>
[/img]
  </body>
</html>

Ik zal ook even uitleg geven om het "leer-effect" te vergroten

Je was de quotes om dog vergeten, javascript denkt dan dat je het over een object hebt ipv een string (en zegt dan gezellig 'undefined')
Je had had +1 staan bij << en -1 bij >>. precies verkeerd om

een div is eigenlijk een object.
met innerHTML kan ik de inhoud veranderen, door er nieuwe html-code in te zetten.
In dit geval alleen een plaatje

[ Voor 62% gewijzigd door KompjoeFriek op 06-04-2004 01:48 ]

WhatPulse! - Rosetta@Home - Docking@Home

dinsdag 6 april 2004 09:39

Acties:

NoTo

Topicstarter

He, thanx. Dat werkt

http://members.home.nl/noto/test3.htm

nu nog een "if file exist" inbouwen.

dude... wait... what...

dinsdag 6 april 2004 14:06

Acties:

NoTo

Topicstarter

Ehm ja ok dat deel werkte perfect... maar nou bij de volgende stap loopt het weer mis

op de volgende pagina staat een foto, als daarop geklikt word moet dynamische een nieuwe site geopend worden, die kwa code hetzelfde zo moeten zijn als test3.htm (zie post hierboven)

deze http://members.home.nl/noto/test4.htm zou dit dus moeten produceren

iemand een idee waar hier de fout inzit? (en zoja waar

)

[ Voor 8% gewijzigd door NoTo op 06-04-2004 14:06 ]

dude... wait... what...