I have the following object

<div class='app_advert'><a href="/apps">GET THE APPS</a></div>

whicch I'll refer to as x I am trying to position automatically above a another element (y), I want to line up the middle of the objects, so my theory goes thus:

x_width = $(x).width();
y_width = $(y).width();
y_position = $(y).offset().left;

x_horizontal_position =  y_position+(y_width/2)-(x_width/2)

I am trying to fetch the width of x using:

jQuery(window).load(function(){
    object_width = jQuery('.apps_advert').width();
    console.log(object_width);
});

but it is returning null.

I am also applying the following CSS, in case this may affect things:

    div.app_advert{
    position: absolute;
    display: none;

    font-size: 17pt;
    top: 0;

}
div.app_advert a{
    color: white;
    text-decoration: none;
}

I have the following object

<div class='app_advert'><a href="/apps">GET THE APPS</a></div>

whicch I'll refer to as x I am trying to position automatically above a another element (y), I want to line up the middle of the objects, so my theory goes thus:

x_width = $(x).width();
y_width = $(y).width();
y_position = $(y).offset().left;

x_horizontal_position =  y_position+(y_width/2)-(x_width/2)

I am trying to fetch the width of x using:

jQuery(window).load(function(){
    object_width = jQuery('.apps_advert').width();
    console.log(object_width);
});

but it is returning null.

I am also applying the following CSS, in case this may affect things:

    div.app_advert{
    position: absolute;
    display: none;

    font-size: 17pt;
    top: 0;

}
div.app_advert a{
    color: white;
    text-decoration: none;
}

• javascript
• jquery
• dom
• layout
• width

• 1 Your checking apps_advert against app_advert. Also checking against a class won't return a single element. Need to set id=app_advert and check #app_advert. – BentFX Commented Jun 20, 2011 at 12:27
• What does console.log(jQuery('.apps_advert').length) give you? – Mutation Person Commented Jun 20, 2011 at 12:29

3 Answers 3

Your class is app_advert but you jQuery code tries to find apps_advert (notice the plural of app to apps)

so try with

object_width = jQuery('.app_advert').width();

If its display: none it has no width. (If null or 0 is the correct value I don't know.)

EDIT: As the others noticed you have a typo in the code "apps" vs "app" in which case null is expected. But still if the element is hidded using display: none, the width should be 0.

change this

object_width = jQuery('.apps_advert').width(); 

to this

object_width = jQuery('.app_advert').width(); 

your div has app_advert class but in your code you have writen apps_advert, and this class doesn't exist. This is the reason why you are getting null