[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 330
  • Last Modified:

Dynamically resizing image to Max height/width

Hello.

I want to resize an image that is displayed with JavaScript.

   Here is some code that should do what I need done:
   http://www.experts-exchange.com/Web/Web_Languages/CSS/Q_21917056.html

            function resize(image) {
              // Thanks, GrandSchtroumpf
              var maxwidth = 200;
              var maxheight = 100;
              var scalewidth = 1;
              var scaleheight = 1;
              if (image.width > maxwidth)  scalewidth = maxwidth/image.width;
              if (image.height > maxheight)  scaleheight = maxheight/image.height;
              var scale = (scalewidth < scaleheight)? scalewidth : scaleheight;
              image.width = Math.round(scale * image.width);
              image.height = Math.round(scale * image.height);
            }

Here is the JS that I need it integrated with:

               <script>
      var par = window.parent.document;
      var images = par.getElementById('images');
      var imgdiv = images.getElementsByTagName('div')[<?=(int)$_POST['imgnum']?>];
      var image = imgdiv.getElementsByTagName('img')[0];
      imgdiv.removeChild(image);
      var image_new = par.createElement('img');
      image_new.src = 'showimage.php?pic=<?=$oname?>';
      image_new.className = 'loaded';
      imgdiv.appendChild(image_new);
      </script>



Any ideas?

Thanks!
0
hankknight
Asked:
hankknight
  • 3
  • 2
1 Solution
 
GrandSchtroumpfCommented:
you can try something like this:
...
     var image_new = par.createElement('img');
     image_new.onload = function() { resize(this); };
     image_new.src = 'showimage.php?pic=<?=$oname?>';
...
0
 
hankknightAuthor Commented:
Thanks!
0
 
GrandSchtroumpfCommented:
You are welcome  :)
0
 
hankknightAuthor Commented:
By the way, I have posted a related but different question here:
http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_21917309.html
0
 
GrandSchtroumpfCommented:
wow, seems like you really want me to get a certification in javascript ;)
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now