Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Mar 2004
    Posts
    91
    Thanks
    0
    Thanked 0 Times in 0 Posts

    span's width and height are 0!

    Hello

    I am displaying the following span on the screen:
    Code:
    <span id="myspan" style="position:absolute; width:0px; height:0px; left:0px; top:0px; display:none; z-index:1000;">
       <table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td>
              <img src="bullet.png" width="16" height="16" style="vertical-align:top">
            </td>
            <td nowrap width="100%" style="padding-left:2px">
               <a href="#" onclick="return false">View</a>
            </td>
          </tr>
          <tr>
            <td>
              <img src="bullet.png" width="16" height="16" style="vertical-align:top">
            </td>
            <td nowrap width="100%" style="padding-left:2px">
              <a href="test.html">Test</a>
            </td>
          </tr>
        </table>
    </span>
    I set the body's style attribute to: position:relative
    The span will get displayed on the screen as a trigger for some event. (where its final left and top attributes will be calculated and assigned, and it will then become visible)

    for debug purposes, I am running the following on the onload event of the body:
    Code:
    var menu = document.getElementById('myspan');	
    var width = menu.offsetWidth;	
    var height = menu.offsetHeight;
    alert("width: " + width + "'nheight: " + height);
    For some reason, the values I am getting are 0!
    Can anyone tell me what is wroing with my code?

    I know that I set the width and height attribute to 0px when the span was defined because I don't know in advance what the actual dimensions of the span will be.

    thanks

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Why not remove the declaration of height and width properties in the span tag and let the browser calculate it based on the content? Anyway the actual size can be retrieved using the offsetWidth and offsetHeight properties.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    ...and, as I have told you in another forum , as long as the display is none, the object suppose to have no size at all, no matter if which it's real size is
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Now since you've got a dilema, try setting negative x or y values instead of using "display:none" to move the span out of the field of view at least until you pick off the width and height.
    Check out the Forum Search. It's the short path to getting great results from this forum.


  •  

    Posting Permissions

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