Sidder og arbejder på hjemmesiden Balkanfestudvalget.dk, og er nået til galleriet, hvor jeg har valgt at bruge en modal box (også kendt som lightbox, darkbox, greybox) til at vise billederne der klikkes på. den oprindelige kode til modal boksen ligger
her, dog har jeg ændret lidt i den af designmæssige årsager.
Spørgsmålet er: Hvordan bruger jeg php til at opdatere billedet i modal boxen til at passe til det thumbnail der bliver klikket på? Har overvejet at bruge enten _POST eller _GET, men ved ikke hvordan jeg gør det mest funktionelt.
Min kode :
<?php
/*
Titel : galleri.php
Beskrivelse : Galleri.
*/
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>* Galleri *</title>
<link href="css.css" rel="stylesheet" type="text/css" />
<script src="javascripts/prototype.js" type="text/javascript" charset="utf-8"></script>
<script src="javascripts/modal.js" type="text/javascript" charset="utf-8"></script>
</head>
<body><table border="0" cellpadding="0" cellspacing="0" width="640">
<tr>
<td class="bg_content_top"><img src="Assets/content/galleri/stencil_galleri_01.jpg" title="Her skal stå lidt info om billedet" width="140" height="60" /><img src="Assets/content/galleri/stencil_billeder_01.gif" width="88" height="35" /></td>
</tr>
</table>
<table width="640" border="0" cellspacing="0" cellpadding="0">
<tr>
<?php
$antalbilleder=31;
$linjeskift=7;
for ($i=1;$i<=$antalbilleder;$i++)
{
if ($i < 10){ // If the value is under 10 then 2 zeros are needed to make a 3 digit value.
$tmbpath = "0" . $i;
}
else {
$tmbpath = $i;
};
echo "<td width='10'> </td><td><table width='80' border='0' cellpadding='0' cellspacing='0' bgcolor='#383b30'>
<tr>
<td height='80' onmouseover=\\"this.style.backgroundColor='#676c58';\\" onmouseout=\\"this.style.backgroundColor='#383b30';\\" align='center'><a href='#' onclick='showBox();return false'><img src='Billeder/Thumbs/tmb",$tmbpath,".jpg' width='70' height='70' border='0' /></a></td>
</tr>
</table></td>";
if ($i == $linjeskift)
{
echo "<td width='10'> </td><tr></tr><td><img src='Assets/content/blank_space.gif' width='10' height='10'/></td></tr>";
$linjeskift += 7;
};
}
?>
<td width='10'> </td><tr></tr><td><img src='Assets/content/blank_space.gif' width='10' height='10'/></td></tr>
</table>
<div id="overlay" style="display:none"></div>
<div id="box" style="display:none">
<img id="close" src="Assets/content/close_btn.jpg" width="25" height="25" onclick="hideBox()" alt="Luk dette vindue"
title="Luk dette vindue" />
<img src="Billeder/img01.jpg" onclick="hideBox()" style="cursor:pointer" /> </div></body>
</html>
og linket til hvordan det ser ud :
http://balkanfestudvalget.dk/TEST/index.php?location=gallerihilsen Aske
