max-width workaround only works after refresh

[bobmurphy]

i am using some javscript to code a workaround to the max-width problem in internet explorer (CSS) -- the page was already using PHP to hold the url's etc of images etc. so i wrote the following code .
// this code is a workaround ie6 not recognising the max-width / max-length properties
if(preg_match( "/MSIE/i", $viewer))
{
echo ("<script language=\"javascript\">");
echo ("var j =\"". ($piclink[$number[$k]]) . "\";");
echo ("var l =\"". ($fullurl) . "\";");
echo ("img = new Image();");
echo ("img.src = j;");

// image is has width too big for boxlocal2 so resize
echo ("if (img.width > 260)");
echo ("{");

// Put the new height which image would be drawn if the width were adjusted into newHeight
echo ("var newHeight = ((260/img.width)*img.height);");

// if the new height will be greater than 50 then adjust the height instead of the width
echo ("if (newHeight >= 50)");
echo ("{");
echo ("document.write ('<a onClick = \"this.blur()\" target = \"_blank\" href = \"'+l+'\"><img class = \"piclinkie\" height = \"50\" src = \"'+j+'\" /></a><br>');");
echo ("}");

// only adjust the horizontal if the adjust will bring the vertical into line
echo ("else");
echo ("{");
echo ("document.write ('<a onClick = \"this.blur()\" target = \"_blank\" href = \"'+l+'\"><img class = \"piclinkie\" width = \"260\" src = \"'+j+'\" /></a><br>');");
echo ("}");

echo ("}");

// if the actual height was greater than 50 anyway (implying that the width was also less than 260) then adjust the height
echo ("else if (img.height >= 50)");
echo ("{");
echo ("document.write ('<a onClick = \"this.blur()\" target = \"_blank\" href = \"'+l+'\"><img class = \"piclinkie\" height = \"50\" src = \"'+j+'\" /></a><br>');");
echo ("}");

// image is not too big in either dimension so draw without width control
echo ("else");
echo ("{");
echo ("document.write ('<a onClick = \"this.blur()\" target = \"_blank\" href = \"'+l+'\"><img class = \"piclinkie\" src = \"'+j+'\" /></a><br>');");
echo ("}");
echo ("</script>");
}

else // browser is not ie so use max-***th
{
echo ("<a onclick = \"this.blur()\" target = \"_blank\" class = \"piclink\" href=\"" . $fullurl . "\">+<img class = \"piclink\" src = \"" . $piclink[$number[$k]] . "\"></a><br><br><br>");
}


it works too -- (though i'm sure it's not so elegant) -- however there is some problem with it displaying the first time the page loads -- on refresh it works fine

also it is pretty hard to replicate this problem as it seems to me that once a browser has 'seen' the code once --it always displays it right after that - even when i delete the cashe

if any of you good people can follow what im doing here and suggest a change that would work then i'd very much appreciate it

the page url where you can see the effect is
www.oneweekofdays.com/links (http://www.oneweekofdays.com/links)

btw the reason i dont just do this whole thing simpler is that the picture links are random (refresh the page to see ) and dynamic ( adding new ones to the databse all the time ) so i'd never be able to keep track of them all

thanks again
bob