cant calculate width of elements

Posted by Kein on Stack Overflow See other posts from Stack Overflow or by Kein
Published on 2010-06-02T09:50:42Z Indexed on 2010/06/02 9:53 UTC
Read the original article Hit count: 252

Filed under:
|

I try to get width of dom objects:

    function resizeArea(){
      var width = 0;
      area.children().each(function(i){
          alert(this.offsetWidth);
          width += this.offsetWidth;
      });
      area.css('width', width);
    }

In get results:

  1. Chrome: 800
  2. Opera: 708
  3. FF: 783
  4. IE: 714

But if see it in firebug, dragonfly and other debuggers i see correct 908px. I don't know where porblem. I run this fun after domloaded.

Here is HTML and css of block:

<div class="scroll_area" id="scroll">
   <div class="area" id="area">
      <div class="category">
      [..]
      </div>
   </div>
 </div>
 <style>
    #scroll {
        position:realtive; width: 800px, heght: 400px;
   }
   #area {
        position:absolute; left: 0; top: 0;
   }
   #area .category, #area .category .text, #area .category .image{
       width: 200px
   }
 </style>

And that interesting. This function later work correctly, only at first run, for first calculating.

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about html