arie - 11 March 2009 10:00 AM
Guys, hi ,
.....
I’m developing an application that outputs a lof of images.
....
OK, let’s start this way:
1. What you use to develop your site ( application ? - is not for web ) ?
2. Some tips: Take a look at a good and free php scripts that you can use for your albums: http://coppermine-gallery.net , or http://www.gallery2.org
What you get = dynamic pages, specially if you have a lot of images.
3. You can unify your images if you make an matrix ( say 600x600 px), and simply add and save your images with matrix. ( take a look at http://www.faktor.rs - you’ll see diferent images, but they are all the same size 600 x 600 px )
4. If you use HTML than: you can make your grid with a table and CSS.
Something like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Simple table as a grid</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
/* this is an internal stylesheet, but you can use external one instead */
#slike {
border: 1px solid #cacaca;
}
.celija {
width: 200px;
height:200px;
background: #cacaca;
}
</style>
</head>
<body>
<table id="slike" border="0" cellspacing="5px" cellpadding="5">
<tr>
<td class="celija"> </td> <!-- instead empty space you put your images -->
<td class="celija"> </td>
<td class="celija"> </td>
</tr>
<tr>
<td class="celija"> </td>
<td class="celija"> </td>
<td class="celija"> </td>
</tr>
</table>
</body>
</html>
5. Or.. you can use <div> instead tables - somethnig like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
/* this is an internal stylesheet, but you can use external one instead */
#okvir {
background: #cacaca;
border:1px solid #c9c9c9;
width: 250px; /*should be definite */
height:250px; /*should be definite as width */
margin:10px 10px;
text-align:center;
float: left;
}
#okvir img {
margin: 15px 15px;
/*padding: 15px 15px;*/
}
</style>
</head>
<body>
<div id="okvir">
<img src="http://www.faktor.rs/images/sierra/bojanka.gif" alt="bojanka">
</div>
<div id ="okvir" >
<img src="http://www.faktor.rs/images/sierra/swat_3.gif" alt="swat" >
</div>
</body>
</html>
Of course - this is only a fishbone of code.