I am setting up this topic so I can discuss the rest of the index program later. It seems most of the votes are going to discussing the Thumbnail program first, so will come back here when I'm finished with that.
For now, here is the rest of the Index program listing:
- Code: Select all
</head>
<body>
<div class="main">
<center>
<H3>Welcome to PCTalk's HTML tutorial</H3>
<H5>Here we will use creating a page to display photographs as a means to help learn HTML.</H5>
<H5>April 2006</H5>
</center>
<p> </p>
<p>
On 18 April 2006 Dave of <a href="http://www.digitalimaging-uk.co.uk/"><b><u>'digital imaging-uk'</u></b></a> convinced me to create a tutorial that would be useful to his forum members and entice them to learn something new. This project is the result.<br><br>
I will be setting this up as a pseudo website, in order to eventually cover much more than simply explaining how to create a photo display page. this example has only a single page link but it would be extremely simple to add as many more as you want.</p>
<p> </p>
<table width="100%">
<tr>
<!-- Left column contains all the ports of call and other major headings leading deeper into the document. Each is an actual link to other sections. -->
<td width=25% valign=top>
<H5><u>Page Links:</u></H5>
<p><a href="Thumbnails.htm">Photo Thumbnails</a></p>
</td>
<!-- Middle column contains explanitory text and inline links to special documents not necessarily related to the ports of call. -->
<td width=70% valign=top><p>
This column is here to give expanded information about the links on the left. Don't like links on the left but want them on the right? Simple, just switch the contents of the two columns in their entirety. Don't forget to change the width of the table columns as well or you won't get the results you are after.<br><br>
The Thumbnails page will not be a grid of photos in a table since that would limit its lateral movement as you resize your browser window. Instead, it will be simple images shown linearly relying on auto-"word-wrap" to create succeeding lines of thumbnails. When I first started creating these pages I used to be very careful about having a certain number of thumbnails on a line until I realized I was limiting the flexibility of the display. Now each section is simply one long line of thumbnails which also simplifies reordering any pictures in the list.<br><br>
<a href="Thumbnails.htm"><b><u>Photo Thumbnails</u></b></a> contains the thumbnails for all the pictures in this project. To see any picture full size, simply click on the corresponding thumbnail.<br><br>
</td>
<!-- Right column is here simply to keep the text "on the page" as it were. -->
<td width=5% valign=top></td>
</tr>
</table>
<h2>All photo, even though displayed on this website, remaind copyright by the respective photographers. Please contact them directly if you wish to use their photos.</h2>
</div>
<script type="text/javascript"><!--
if (window.print) {
document.write('<input type="image" title="Print This Page" alt="Print This Page" src="Graphics/printer.gif" onclick="window.print()">') ;}
//-->
</script><br>
<script type="text/javascript"><!--
if (document.write) {
document.write('<b>Print This Page</b>');}
//-->
</script><br>
<script language="JavaScript" type="text/javascript">
<!--
document.write("Last Modified " + document.lastModified)
// -->
</script>
</body>
</html>
