The content div's attributes

The content div's attributes

Hi guys,
I'm having a page life-cycle problem, I'm trying to create a "shadow" div which will cover the entire content (a UI tweak, sounds stupid but well, that's my job)
and naturally I'm doing it on pagebeforeshow, in order for it to get the right positions I use the content div's top and left att. my problem is, there's a header, and on pagebeforeshow the content div's attributes are not correct, they both return 0 where the top attribute should return 54 (and it does, but only on pageshow), what options have I got if I want to set all the UI before the page is shown?

Page:
  1. <div data-role="page" data-back-btn-text="Settings" id="settings-category">
          <div id="settings-category-header" data-role="header" data-backbtn="false">
    <h1>
                            <span id="settings-category-header-text" class="settings-header"></span>                         </h1>
    </div>
            <div id="settings-category-header-bottom-line" class="header-bottom-line"></div>
    <div id="settings-category-black-surface" class="black-surface"></div>
            <div id='settings-category-content' data-role="content"></div>
    </div>

This is the part i want running on pagebeforeshow:

  1. var screenWidth   = screen.width;
    var screenHeight  = screen.height;
    var measureUnits  = "px";
    divHeaderBottomLine.css('top', content.position().top)
           .css('position', 'absolute')    
    css('left', content.position().left);

    divHeaderBottomLine.width('100%');
    divHeaderBottomLine.height((screenHeight * 0.0010416666666667) + measureUnits);
    /** Black surface layer */
    divBlackSurface.css('top', content.position().top)
                 .css('position', 'absolute')    
           .css('left', content.position().left);
    divBlackSurface.width(page.width());
    /** This is done in order not to exceed the page size (avoiding the appearance of a scroll) */  
    var totalHeaderHeight = header.height();
    totalHeaderHeight += parseInt(header.css('border-top-width'));
    totalHeaderHeight += parseInt(header.css('border-bottom-width'));
    totalHeaderHeight += divHeaderBottomLine.height();
    divBlackSurface.height(page.height()-totalHeaderHeight);