SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Thread: Find div width

  1. #1
    SitePoint Zealot fatnic's Avatar
    Join Date
    Aug 2006
    Location
    Lincoln, UK
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Find div width

    Hi. Bit of a newbie to javascript (PHP man myself). i'm trying to find the width of a <div> element, however I believe there is a flaw in my code. Can someone help?

    Code:
    	var picc = document.getElementById('pic');
    	var maxx = picc.style.width - 150;
    	alert(maxx);
    Thanks.

  2. #2
    SitePoint Guru Ize's Avatar
    Join Date
    Nov 2005
    Location
    The Netherlands
    Posts
    808
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The style property is only filled with data when the style is declared inline:

    Code:
    <div id="pic" style="width:100px;"></div>
    You can use the Javascript offsetWidth property (note that this only gives a reliable result when the element is completely loaded):

    Code:
    alert (document.getElementById('pic').offsetWidth);
    Or you can fetch the computed style rule, described in this article.

  3. #3
    SitePoint Zealot fatnic's Avatar
    Join Date
    Aug 2006
    Location
    Lincoln, UK
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just a bit of information. Found a quick way to do it with the Prototype framework. I believe it calculates the computed dimensions, but close enough for me!

    Only takes one line of code too...

    Code:
    div_height = Element.getHeight('div')
    Easy peasy! Thanks for the help.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •