Well, I wouldn't scale images by percent, but you could specify a width and let the browser figure out the height on its own. Or the other way around, specify the height and leave open the width.
Here's a clever thing to do with CSS and Javascript:
In the head put this:
<style type="text/css">
<!--
img {border: 0px;}
img.thumb {display: block; float: left; margin: 5px;}
-->
</style>
And in the body where you want to put your thumbs put this:
<script language="javascript" type="text/javascript">
<!--
thumbArray = new Array('thumb1.jpg','thumb2.jpg');
linkArray = new Array('link1.jpg','link2.jpg');
for(j=0;j< thumbArray.length;j++) document.write("<a href=\"images/" + linkArray[j] + "\"><img src=\"images/" + thumbArray[j] + "\" width=\"100\" class=\"thumb\" />[/url]";
-->
</script>
This creates a group that the script loops through and places each object of the group in a spot that corresponds with the number of the loop.
You can forgo the javascript and just use the CSS to set the width or height of the thumbs. The important parts are you need to specify "class='thumb'" in the <img> tag and you need to add "width: 100px;" or "height: 100px" to the CSS line "img.thumb".
You can also make the Javascript easier by naming the thumbnails and larger images a number: 1.jpg & 1_lg.jpg for example. Then if you have 25 images you can do this:
<script language="javascript" type="text/javascript">
<!--
for(j=1;j < 26;j++) document.write("<a href=\"images/" + j + "_lg.jpg\"><img src=\"images/" + j + ".jpg\" class=\"thumb\" />[/url]";
-->
</script>
And you don't need to mess with the arrays.
I gave you some options, and if it helps, terrific. If you get lost, I'd say thats to be expected
Topic: newbie HTML question (Read 4167 times)
