Toon posts:

kan dit met html/php en hoe?

Pagina: 1
Acties:
  • 36 views sinds 30-01-2008

Verwijderd

Topicstarter
Hallo allemaal, ik ben bezig met het maken van een website waar ik een fotogallery op wil zetten. Het idee is om de site er als volgt uit te laten zien:

t1 t2 t3 t4


t5 image t6


t7 t8 t9 t10


t1 t/m t10 staan voor thumbnails van plaatjes, Image in het midden is een tabel waarin ik graag het plaatje dat aan de thumb is gekoppeld wil displayen. Ik maak gebruik van html op dit moment, weet iemand hoe ik dit idee kan realiseren?

  • Dark Blue
  • Registratie: Februari 2001
  • Laatst online: 21-08 18:36

Dark Blue

Compositionista!

Alpenmeisje

Jahoor, dat kan, met PHP.

Maak een loopje waarin je telkens 9 images aanroept, en als er in de directory o.i.d. meer dan 9 images staan (wat dus waar is) moet hij die in een nieuwe pagina zetten.. (hm daar heb k geen ervaring mee) ...

Hoe je de layout verder doet maakt voor je code niet uit...

[ Voor 128% gewijzigd door Dark Blue op 17-07-2003 18:35 ]

heidiulrich.nl | adventura.nl : rugzakavonturen | pathwise.nl : prepping geeks to get jobs


  • Willem
  • Registratie: Februari 2001
  • Laatst online: 22:08
Ja, dat kan, en er zijn vele wegen die naar Rome leiden. :)

Wees eens creatief met tabellen, en denk daarbij bijvoorbeeld en row- en colspan die je waarschijnlijk moet gaan gebruiken.

Volgende keer wel zelf eerste eens even e.e.a. zelf uitproberen in plaats van hier om een oplossing te komen vragen. :)

Motor (of auto) onderhoud bijhouden


  • WFvN
  • Registratie: Oktober 2000
  • Laatst online: 16-08 17:44

WFvN

Gosens Koeling en Warmte

Tabelletje maken met daarin de links. In de middelste cel een I-frame maken..... Tenminste.... dit is volgens mij de eenvoudigste manier (als je geen PHP kent)

  • nrg
  • Registratie: April 2001
  • Laatst online: 19:24

nrg

Het kan idd met PHP, JavaScript ([image].src = [nieuwe url]) of met JavaScript icm een Iframe ([iframe].src = [nieuwe url]).

Vrij simpel op te lossen.

Hebben al die images dezelfde afmetingen?

Verwijderd

Of gewoon met javascript een preloader maken en een onclick die de juiste foto weergeeft in het midden. Je kunt hier Dreamweaver heel gemakkelijk voor gebruiken.

  • dingstje
  • Registratie: Augustus 2002
  • Laatst online: 02-01-2024
wfvn schreef op 17 July 2003 @ 18:35:
Tabelletje maken met daarin de links. In de middelste cel een I-frame maken..... Tenminste.... dit is volgens mij de eenvoudigste manier (als je geen PHP kent)
... of gewoon JavaScript gebruiken :)

If you can't beat them, try harder


Verwijderd

Topicstarter
nrg schreef op 17 July 2003 @ 18:37:
Het kan idd met PHP, JavaScript ([image].src = [nieuwe url]) of met JavaScript icm een Iframe ([iframe].src = [nieuwe url]).

Vrij simpel op te lossen.

Hebben al die images dezelfde afmetingen?
Ja alle images hebben dezelfde afmetingen, ik heb al een tabel met daarin de verschillende thumbs. Moet nu alleen nog weten hoe ik een aangeklikte thumb in dat middelste tabelletje krijg...

  • GGS_VR6
  • Registratie: Juli 2001
  • Niet online

GGS_VR6

Oranje!

Plaats die tabel anders es hier, dan kunnen we even zien hoe je het in elkaar hebt :)

T.net ID. Bekijk het maar es eem..
‹(◕‿◕)›


Verwijderd

Topicstarter
GGS_VR6 schreef op 17 July 2003 @ 18:40:
Plaats die tabel anders es hier, dan kunnen we even zien hoe je het in elkaar hebt :)
Oke hier is mijn index:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<html>
  <head>
   <link rel="stylesheet" content="text/css" href="style.css"> 
   <title>Pagina met vakantiefoto's.</title>
  </head>

  <body>
 
  <center>

  <p align="center"><br>
  <table width=600 border=0 cellspacing=0 cellpadding=10>
   <tr>
    <td align="center"><a href="pics/01.jpg">[img]"pics/thumb1.jpg"[/img]</a></td>
    <td align="center"><a href="pics/02.jpg">[img]"pics/thumb2.jpg"[/img]</a></td>
    <td align="center"><a href="pics/03.jpg">[img]"pics/thumb3.jpg"[/img]</a></td>
    <td align="center"><a href="pics/04.jpg">[img]"pics/thumb4.jpg"[/img]</a></td>
   </tr>
   <tr>
    <td align="center"><a href="pics/05.jpg">[img]"pics/thumb5.jpg"[/img]</a></td>
    <td  align="center" colspan="2" rowspan="2" valign="top">
     <table border=0 cellpadding=0 cellspacing=0  width="390" height="310">
      <tr height="100%" width="100%">
      <td align="center"> Hier zou ipv deze tekst de foto moeten komen
      </td> 
    </tr>
  </table>
</td>
<td align="center"><a href="pics/06.jpg">[img]"pics/thumb6.jpg"[/img]</a></td>
</tr>
<tr>
<td align="center"><a href="pics/07.jpg">[img]"pics/thumb7.jpg"[/img]</a></td>
<td align="center"><a href="pics/08.jpg">[img]"pics/thumb8.jpg"[/img]</a></td>
</tr>
<tr>
<td align="center"><a href="pics/09.jpg">[img]"pics/thumb9.jpg"[/img]</a></td>
<td align="center"><a href="pics/10.jpg">[img]"pics/thumba.jpg"[/img]</a></td>
<td align="center"><a href="pics/11.jpg">[img]"pics/thumbb.jpg"[/img]</a></td>
<td align="center"><a href="pics/12.jpg">[img]"pics/thumbc.jpg"[/img]</a></td>
</tr>
</table>



<table width=500 border=0 cellspacing=0 cellpadding=0><tr><td align="center">
<p align="center"><br>
2003 
</td></tr></table>


</center>
</body>
</html>

  • marty
  • Registratie: Augustus 2002
  • Laatst online: 27-03-2023
Verwijderd schreef op 17 juli 2003 @ 18:39:
[...]


Ja alle images hebben dezelfde afmetingen, ik heb al een tabel met daarin de verschillende thumbs. Moet nu alleen nog weten hoe ik een aangeklikte thumb in dat middelste tabelletje krijg...
Een functie schrijven die geactiveerd wordt door een onclick of onmouseover. en aan die functie een id mee geven die er voor zorgt dat de src van het plaatje verandert. is in feite niets anders dan een button in een menu die op een onmouseover reageert. als je een beetje zoekt moet je daar wel uitkomen volgens mij

  • WFvN
  • Registratie: Oktober 2000
  • Laatst online: 16-08 17:44

WFvN

Gosens Koeling en Warmte

2 wijzigingen aangebracht.... regel 24 en 29

HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<html>
  <head>
   <link rel="stylesheet" content="text/css" href="style.css"> 
   <title>Pagina met vakantiefoto's.</title>
  </head>

  <body>
 
  <center>

  <p align="center"><br>
  <table width=600 border=0 cellspacing=0 cellpadding=10>
   <tr>
    <td align="center"><a href="pics/01.jpg">[img]"pics/thumb1.jpg"[/img]</a></td>
    <td align="center"><a href="pics/02.jpg">[img]"pics/thumb2.jpg"[/img]</a></td>
    <td align="center"><a href="pics/03.jpg">[img]"pics/thumb3.jpg"[/img]</a></td>
    <td align="center"><a href="pics/04.jpg">[img]"pics/thumb4.jpg"[/img]</a></td>
   </tr>
   <tr>
    <td align="center"><a href="pics/05.jpg">[img]"pics/thumb5.jpg"[/img]</a></td>
    <td  align="center" colspan="2" rowspan="2" valign="top">
     <table border=0 cellpadding=0 cellspacing=0  width="390" height="310">
      <tr height="100%" width="100%">
      <td align="center"><iframe name="test" id="test"> Hier zou ipv deze tekst de foto moeten komen</iframe>
      </td> 
    </tr>
  </table>
</td>
<td align="center"><a href="http://gathering.tweakers.net/global/templates/got/images/layout/muts.gif" target="test">[img]"pics/thumb6.jpg"[/img]</a></td>
</tr>
<tr>
<td align="center"><a href="pics/07.jpg">[img]"pics/thumb7.jpg"[/img]</a></td>
<td align="center"><a href="pics/08.jpg">[img]"pics/thumb8.jpg"[/img]</a></td>
</tr>
<tr>
<td align="center"><a href="pics/09.jpg">[img]"pics/thumb9.jpg"[/img]</a></td>
<td align="center"><a href="pics/10.jpg">[img]"pics/thumba.jpg"[/img]</a></td>
<td align="center"><a href="pics/11.jpg">[img]"pics/thumbb.jpg"[/img]</a></td>
<td align="center"><a href="pics/12.jpg">[img]"pics/thumbc.jpg"[/img]</a></td>
</tr>
</table>



<table width=500 border=0 cellspacing=0 cellpadding=0><tr><td align="center">
<p align="center"><br>
2003 
</td></tr></table>


</center>
</body>
</html>

Dit werkt in ieder geval. Zelf nog even spelen met de size e.d.
Thumb 6 klikken....

[ Voor 74% gewijzigd door WFvN op 17-07-2003 18:51 ]


Verwijderd

Topicstarter
Thnx voor de hulp wfvn ik ga hier eens even mee aan de slag!

Verwijderd

ben ik nou de enige die vind dat dit niet met een tabel moet maar met een list? denk maar eens na over wat je eigenlijk laat zien, namelijk een lijst met thumbjes en een centrale plaat. Dat die dingen een beetje niet als een gemiddelde lijst gerangschikt zijn doet niet ter zake. Niet de layout moet je keuze voor bepaalde tags bepalen, maar de data.

Denk altijd na over wat je overhoudt als je alle layout weg zou halen, dus wat een textbrowser zou laten zien. Dat moet steek houden namelijk, dat is een goeie manier van data markeren.

  • SinergyX
  • Registratie: November 2001
  • Laatst online: 01:50

SinergyX

____(>^^(>0o)>____

een iframe wordt niet door elke browser ondersteund, de oplossing van nrg lijkt me een veel beter plan.

/me heeft ook een gallery die soortgelijke doet

Nog 1 keertje.. het is SinergyX, niet SynergyX
Im as excited to be here as a 42 gnome warlock who rolled on a green pair of cloth boots but was given a epic staff of uber awsome noob pwning by accident.


Verwijderd

Topicstarter
Ik heb het nu met een iframe aan de gang, heb alleen nog één vraagje. Als ik nu het plaatje aanklik , komt netjes de grote variant in het iframe terecht, omdat dit echter alleen maar een plaatje is, zit er een marge tussen de bovenkant en de linker-zijkant, die ik eigenlijk niet wil hebben. Ik zal ff een voorbeeldje laten zien

Afbeeldingslocatie: http://www.zeemeijer.nl/skriensjot.JPG

Verwijderd

als je toch php doet zou ik daar een scriptje voor maken, want die randen haal je alleen maar weg door een html pagina te maken

pseudocode:
PHP:
1
2
3
4
src = $get(plaatje)
print 'htmlpagina zonder marges'
print 'image tag met src'
print 'rest html'

(mijn phpkennis is zwaar onder de maat, ik doe voornamelijk asp, vandara brakke code, maar je snapt het wel)

Verwijderd

Topicstarter
ik heb de pagina in html gemaakt, er is in html vast ook wel een oplossing voor een dergelijk probleem?

  • Mayco
  • Registratie: Augustus 2002
  • Laatst online: 19-08 06:59
voor elke image een html pagina (met de hand!) maken, dus ik denk dat je best wel een php-oplossing neemt, dan kan je trouwens ook ipv dat iframe gewoon de gevraagde foto daar zetten.

  • SinergyX
  • Registratie: November 2001
  • Laatst online: 01:50

SinergyX

____(>^^(>0o)>____

Verwijderd schreef op 17 July 2003 @ 19:15:
ik heb de pagina in html gemaakt, er is in html vast ook wel een oplossing voor een dergelijk probleem?
lees oplossing dan van nrg, javascript is de oplossing.

alleen moet je steeds losse pagina's maken voor elke 10 pics.

Nog 1 keertje.. het is SinergyX, niet SynergyX
Im as excited to be here as a 42 gnome warlock who rolled on a green pair of cloth boots but was given a epic staff of uber awsome noob pwning by accident.


Verwijderd

Anders maak je de achtergrond van de hele file ook wit, zie je het randje niet meer :)

  • mulder
  • Registratie: Augustus 2001
  • Laatst online: 22-08 10:45

mulder

ik spuug op het trottoir

kijk eens naar de style property, css en bv de margin instelling. dit heeft totaal niks met php te maken, enkel 1 html pagina.

oogjes open, snaveltjes dicht


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 00:02

crisp

Devver

Pixelated

als je toch met javascript aan de gang gaat, ditch dan dat hele iframe en verander het plaatje rechtstreeks in je document.

verder is dit wel redelijk basic allemaal...

[ Voor 16% gewijzigd door crisp op 17-07-2003 19:35 ]

Intentionally left blank

Pagina: 1

Dit topic is gesloten.