Ang Talunin wrote on 10 okt 2003 in comp.lang.javascript
:
[color=blue]
> Hey,
> When I use the code beneath I'm trying to resize a img depending on
> the resolution of the visitor.
> The images resizes fine, but the table doesn't! That keeps using the
> widht of the original image.
> I tried to put td { width=60%} in the style tag, but that didn't help
> either.
> How to fix this???
>
> thnx,
>
> A.T.
>
>
> <html>
> <head>
> <script language="JavaScript"><!--
> browser_version= parseInt(navigator.appVersion);
> browser_type = navigator.appName;
> if (window.screen.width == "1024") {
> document.write("<style>img { width=100%}</style>");
>}
> else if (window.screen.width == "800") {
> document.write("<style>img { width=60%;}</style>");
>}
> // --></script>
> </head>
> <body>
> <table><tr>
> <td><img src='im1.jpg' ></a></td>
> <td><img src='im2.jpg' ></a><td>
> </tr>
> </table>[/color]
1
width=60%;
should be
width:60%;
2
this is NOT 60% of the original img width, but 60% of the td width !
3
The </a>'s make no sense here.
4
The last <td> should be </td>
=========================
This will do what you probably want:
<style>
table {width:100%;} /* follows the window width */
td {width:50%;} /* follows the table width */
img {width:100%;} /* follows the td width */
</style>
<table><tr>
<td><img src='im1.jpg'></td>
<td><img src='im2.jpg'></td>
</tr></table>
not tested.
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
