Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

How to get bottom with jQuery?

HI, I need to find out how can I get the bottom of an element. In this case I'm trying to find out the height of header, and then get it's bottom, so when the bottom hit's the browser top window, I will show a sub-menu.

heres what i'm currently having

1 Answer

Add outerheight() to the top and you have the bottom, relative to the parent element

var el = $('#bottom');  //this would just be your selector
var bottom = el.position().top + el.outerHeight(true);

With absolutely positioned elements or when positioning relative to the document, you need to instead evaluate using an offset:

var bottom = el.offset().top + el.outerHeight(true)

the reason outerHeight(true) is used is that this would take into account the margin as well. (ie content + padding + border+margin). Without using true, you get the (content + padding + border).

Thank you. I managed to do it :D

codepen

Do you think the code is okay?