3 Replies - 399 Views - Last Post: 19 October 2010 - 11:33 AM

#1 eTech1  Icon User is offline

  • D.I.C Head

Reputation: 6
  • View blog
  • Posts: 135
  • Joined: 27-August 10

Resizing Image Tag For IE

Posted 19 October 2010 - 09:49 AM

I've written some javasript code to resize an image tag. While the page loads the image tag is display: none so a large image wont break the stylesheet before I have a chance to shrink it. onload I call function load1 and you can follow the rest from the code below.

This is working in Firefox and Chrome and appears to be doing absolutely nothing in any version of IE. I assume this is common but I'm not finding an answer on google or the forums.

Thanks for the look

Javascript after </html> tag:
<script type="text/Javascript">
    function load1() {
        imageLoaded();
        document.getElementById("confImage").style.display = "block";
    }

    function imageLoaded() {
        var iW = document.getElementById("confImage").width;
        var iH = document.getElementById("confImage").height;
        changeImageSize(iW, iH);
    }

    function changeImageSize(iW, iH) {
        if (iW > 460 || iH > 460) {
            //  reset dimension of image to fit in div
            var multiply = 0;
            if (460 / iW < 460 / iH) {
                multiply = myFloor(460 / iW, 3);
            } else {
                multiply = myFloor(460 / iH, 3);
            }

            document.getElementById("confImage").width = multiply * iW;
            document.getElementById("confImage").height = multiply * iH;
        }
    }

    function myFloor(n, pos) {
        n = "" + n;
        if (n.length < n.indexOf('.') + pos + 1) {
            return parseInt(n);
        } else {
            return n.substr(0, n.indexOf('.') + pos);
        }
    }
</script>

This post has been edited by eTech1: 19 October 2010 - 09:50 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Resizing Image Tag For IE

#2 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3490
  • View blog
  • Posts: 10,058
  • Joined: 08-June 10

Re: Resizing Image Tag For IE

Posted 19 October 2010 - 10:29 AM

View PosteTech1, on 19 October 2010 - 04:49 PM, said:

Javascript after </html> tag:

it should be before the </html> tag.
Was This Post Helpful? 0
  • +
  • -

#3 eTech1  Icon User is offline

  • D.I.C Head

Reputation: 6
  • View blog
  • Posts: 135
  • Joined: 27-August 10

Re: Resizing Image Tag For IE

Posted 19 October 2010 - 11:11 AM

That might be true according to standards, I really don't know but it makes no difference when I move it in this situation and I've never seen it act any differently if it was in vs. out of the html tags.

When I window.alert the values of iW and iH (the width and height) firefox displays correct numbers and IE displays 0's... Is it possible IE is running the body onload before the image actually loads?

This post has been edited by eTech1: 19 October 2010 - 11:24 AM

Was This Post Helpful? 0
  • +
  • -

#4 eTech1  Icon User is offline

  • D.I.C Head

Reputation: 6
  • View blog
  • Posts: 135
  • Joined: 27-August 10

Re: Resizing Image Tag For IE

Posted 19 October 2010 - 11:33 AM

*SOLVED*

I forgot IE likes to treat hidden elements like they don't exist. Had to make my image display block just after load and before i get the image width/height.

function load1() {
            document.getElementById("confImage").style.display = "block";
            imageLoaded();
        }

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1