max-width workaround only works after refresh

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 .

[code=php]// 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>”);
}[/code]

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
[URL=http://www.oneweekofdays.com/links]www.oneweekofdays.com/links[/URL]

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

Also in #JavaScript _↴