Scaling images in IE

R

Ron Crump

Hi,

I have a small javascript (scalegr.js) that re-scales a sequence of
images on a page to be less than the frame width, thus:

function scalegr(a) {
var imgs = document.images;
var fw = window.innerWidth;
for (var i=0; i<imgs.length; i++) {
var w=imgs.width;
imgs.width = a*fw
}
}

Which is called from an HTML page as follows:

<HTML>
<HEAD>
<TITLE> Test Image Scaling</TITLE>
<script type='text/javascript' src='scalegr.js'></script>
</HEAD>
<body onload="javascript:{if(parent.frames[0]&&parent.frames['navbar'].Go)parent.frames['navbar'].Go();scalegr(0.85)}"
onresize="javascript:{scalegr(0.85)}">
<H1>Image</H1>
<IMG SRC="trend1.gif" BORDER="0">
</BODY>
</HTML>

This works fine in Netscape/Mozilla but in IE, the images appear to
load (ie they are visible until loading completes) then they
disappear.

Any suggestions gratefully received, fixes to the above or a general
way of scaling my simple images to account for people with different
resolutions and/or not maximised browser displays.

Could you copy replies to my e-mail too, please (rcrump at une dot edu
dot au).

TIA.

Ron Crump
 
M

Martin Honnen

Ron said:
Hi,

I have a small javascript (scalegr.js) that re-scales a sequence of
images on a page to be less than the frame width, thus:

function scalegr(a) {
var imgs = document.images;
var fw = window.innerWidth;
for (var i=0; i<imgs.length; i++) {
var w=imgs.width;
imgs.width = a*fw
}
}

Which is called from an HTML page as follows:

<HTML>
<HEAD>
<TITLE> Test Image Scaling</TITLE>
<script type='text/javascript' src='scalegr.js'></script>
</HEAD>
<body onload="javascript:{if(parent.frames[0]&&parent.frames['navbar'].Go)parent.frames['navbar'].Go();scalegr(0.85)}"
onresize="javascript:{scalegr(0.85)}">
<H1>Image</H1>
<IMG SRC="trend1.gif" BORDER="0">
</BODY>
</HTML>

This works fine in Netscape/Mozilla but in IE, the images appear to
load (ie they are visible until loading completes) then they
disappear.

Any suggestions gratefully received, fixes to the above or a general
way of scaling my simple images to account for people with different
resolutions and/or not maximised browser displays.


The problem is that you use
window.innerWidth
which doesn't exist in IE's object model, there the property is
undefined. Thus you need
var fw;
if (typeof window.innerWidth != 'undefined')
fw = window.innerWidth;
}
else if (document.body && document.body.clientWidth)
fw = document.body.clientWidth
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,769
Messages
2,569,578
Members
45,052
Latest member
LucyCarper

Latest Threads

Top