getting computed style for Img width and height

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • liketofindoutwhy

    getting computed style for Img width and height

    For Firefox, we can get the computed style of an Img element, using
    the script in



    so even if we set only the width of an Image in CSS, we will get both
    the width and height of the final rendered image.

    However, it won't work in IE 7.... the width will return the original
    value, but the height is "NaN".... is there a way to get the final
    rendered width and height of an image in both Firefox and IE?
  • Joost Diepenmaat

    #2
    Re: getting computed style for Img width and height

    liketofindoutwh y <liketofindoutw hy@gmail.comwri tes:
    For Firefox, we can get the computed style of an Img element, using
    the script in
    >

    >
    so even if we set only the width of an Image in CSS, we will get both
    the width and height of the final rendered image.
    I would use offsetHeight / offsetWidth for that instead. I'm not
    convinced width and height *should* be part of the computed style, and
    also, computed styles may be returned *any* supported unit, while
    offsets are always given in pixels (which is usually what you want).

    Offsets are mentioned in the first paragraph of javascript code on the
    page you linked.
    However, it won't work in IE 7.... the width will return the original
    value, but the height is "NaN".... is there a way to get the final
    rendered width and height of an image in both Firefox and IE?
    Re-read that page.

    --
    Joost Diepenmaat | blog: http://joost.zeekat.nl/ | work: http://zeekat.nl/

    Comment

    • liketofindoutwhy

      #3
      Re: getting computed style for Img width and height

      On Apr 22, 10:59 pm, Joost Diepenmaat <jo...@zeekat.n lwrote:
      liketofindoutwh y <liketofindout. ..@gmail.comwri tes:
      For Firefox, we can get the computed style of an Img element, using
      the script in
      >>
      so even if we set only the width of an Image in CSS, we will get both
      the width and height of the final rendered image.
      >
      I would use offsetHeight / offsetWidth for that instead. I'm not
      convinced width and height *should* be part of the computed style, and
      also, computed styles may be returned *any* supported unit, while
      offsets are always given in pixels (which is usually what you want).
      >
      Offsets are mentioned in the first paragraph of javascript code on the
      page you linked.
      >
      However, it won't work in IE 7.... the width will return the original
      value, but the height is "NaN".... is there a way to get the final
      rendered width and height of an image in both Firefox and IE?
      >
      Re-read that page.
      eh, that's right, offsetWidth and offsetHeight do work... and
      clientWidth, scrollWidth also work... I wonder why the later 2 are
      less known and not even in the Definitive Javascript book.
      clientWidth is more accurate width for the image as it doesn't include
      the border, if any, for the image. scrollWidth is always the same as
      offsetWidth even if i resize my window... i can't make them different.

      Comment

      Working...