user1915190
user1915190

Reputation: 307

Finding the height of the space above a div

I have some divs with unique IDs in different places in my webpage. I want to find the exact height of the space above the div (till its find the starting position of the screen) as mentioned in the image below,

enter image description here

Is there are anyways to do this in jQuery? please help me do this,

Regards,

Upvotes: 1

Views: 1933

Answers (4)

Gonçalo Vieira
Gonçalo Vieira

Reputation: 2249

adding this answer for those looking to find this without jQuery:

var distanceTop = document.getElementById( 'elementId' ).offsetTop;

or, for those who are nitpicky:

var divId = document.getElementById( 'elementId' );
var distanceTop = divId.offsetTop;

Upvotes: 1

Jai
Jai

Reputation: 74738

You can use .offset().top or .position().top:

console.log($('div[id]').offset().top); // it give you offset top of the document

console.log($('div[id]').position().top); // gives you the containers position 
                                          // from the top if container is 
                                          // relative positoned.

find in the fiddle: http://jsfiddle.net/zVzBQ/

 $('div[id]').each(function () {
    console.log($(this).offset().top);
 });

Upvotes: 4

Pete
Pete

Reputation: 58422

You can use offset if you are wanting them relative to the document:

http://api.jquery.com/offset/

$('#a').offset().top

Upvotes: 2

Alex
Alex

Reputation: 421

You can use the jQuery function position to get the position of the element/elements http://api.jquery.com/position/

Upvotes: 1

Related Questions