Dynamic resizing of images

Discussion in 'Javascript' started by Mike, Jan 26, 2004.

  1. Mike

    Mike Guest

    I need to be able to set EITHER document.imageName.width OR
    document.imageName.height to a specific value and then have the other
    property set to it's default. For instance, if I was going to
    hard-code all these images, some would look like <img src=blah
    width=100> and some would look like <img src=blah2
    height=100>. How do I "leave off" the second sizing parameter from
    javascript. I've tried width='', width=0, width=null - none of these
    work as they make the image have zero width.
     
    Mike, Jan 26, 2004
    #1
    1. Advertising

  2. Mike

    Grant Wagner Guest

    Mike wrote:

    > I need to be able to set EITHER document.imageName.width OR
    > document.imageName.height to a specific value and then have the other
    > property set to it's default. For instance, if I was going to
    > hard-code all these images, some would look like <img src=blah
    > width=100> and some would look like <img src=blah2
    > height=100>. How do I "leave off" the second sizing parameter from
    > javascript. I've tried width='', width=0, width=null - none of these
    > work as they make the image have zero width.


    I'm not sure what the problem is, if you don't want to change a particular
    dimension of a particular image, just don't change it:

    <body onload="setTestImageHeight();">
    <script type="text/javascript">
    function setTestImageHeight() {
    document.images['testImage'].height = 200;
    }
    </script>
    <img src="100by100.gif" name="testImage" />

    After loading this page, the test image will be 200 pixels high and 100
    pixels wide (assuming the browser supports dynamically resized images).

    --
    | Grant Wagner <>

    * Client-side Javascript and Netscape 4 DOM Reference available at:
    *
    http://devedge.netscape.com/library/manuals/2000/javascript/1.3/reference/frames.html

    * Internet Explorer DOM Reference available at:
    *
    http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp

    * Netscape 6/7 DOM Reference available at:
    * http://www.mozilla.org/docs/dom/domref/
    * Tips for upgrading JavaScript for Netscape 7 / Mozilla
    * http://www.mozilla.org/docs/web-developer/upgrade_2.html
     
    Grant Wagner, Jan 27, 2004
    #2
    1. Advertising

  3. Mike

    Randy Webb Guest

    @SM wrote:

    <--snip-->

    > <p><a href="javascript:resizeImage('i04',500,'');">exo 1</a>
    > <p><a href="javascript:resizeImage('i04','',150);">exo 2</a>
    > <p><a href="javascript:resizeImage('i02','',50);">exo 3</a>


    Perhaps you have not read the group FAQ? If you haven't, then you
    should. URL is in my signature.

    --
    Randy
    Chance Favors The Prepared Mind
    comp.lang.javascript FAQ - http://jibbering.com/faq/
     
    Randy Webb, Jan 27, 2004
    #3
  4. Mike

    @SM Guest

    Mike a ecrit :
    >
    > I need to be able to set EITHER document.imageName.width OR
    > document.imageName.height to a specific value and then have the other
    > property set to it's default. For instance, if I was going to
    > hard-code all these images, some would look like &lt;img src=blah
    > width=100&gt; and some would look like &lt;img src=blah2
    > height=100&gt;. How do I "leave off" the second sizing parameter from
    > javascript. I've tried width='', width=0, width=null - none of these
    > work as they make the image have zero width.


    understood anything !

    function resizeImage(img,width,height){
    if(document.images){
    i=document.images;
    alert('image default width = '+i.width+
    '\nimage default height = '+i.height);
    if(width!='' && i.width!=width) i.width=width;
    else
    if(height!='' && i.height!=height) i.height=height;
    }}

    <img src="asm.gif" name="i04" width=50>
    <img src="asm.gif" name="i02">
    <p><a href="javascript:resizeImage('i04',500,'');">exo 1</a>
    <p><a href="javascript:resizeImage('i04','',150);">exo 2</a>
    <p><a href="javascript:resizeImage('i02','',50);">exo 3</a>

    --
    ******** (enlever/remove [OTER_MOI] du/from reply url) *******
    St├ęphane MORIAUX : mailto:
    Aide aux Pages Perso (images & couleurs, formulaire, CHP, JS)
    [url]http://perso.wanadoo.fr/stephane.moriaux/internet/[/url]
    **************************************************************
     
    @SM, Jan 28, 2004
    #4
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Ron Vecchi
    Replies:
    1
    Views:
    385
  2. Clyde Ellul

    Resizing GIF images: please help!

    Clyde Ellul, Oct 16, 2003, in forum: Java
    Replies:
    6
    Views:
    550
    Millian Brave
    Oct 16, 2003
  3. BG Mahesh
    Replies:
    1
    Views:
    416
    Roedy Green
    Jan 13, 2006
  4. Pil (Trustworthy from Experience)

    Resizing a div by resizing its borders

    Pil (Trustworthy from Experience), Apr 18, 2009, in forum: Javascript
    Replies:
    9
    Views:
    355
    Proper
    Apr 21, 2009
  5. Proper
    Replies:
    0
    Views:
    200
    Proper
    Apr 18, 2009
Loading...

Share This Page