offsetTop returning value relative to fixed element

JavaScript
1

EDIT: dam. the title of this post is misleading, its more “position absolute relative to fixed element”, I believe the offset is being calculated correctly. Note that the fixed and absolute elements are completely separate. And i’ve just realised this is probably in the wrong forum, bahhhhh sorry guys.

Hi guys,

I’ve got a bit of a weird one here. I have a nav bar (with an add above it) that turns position:fixed; as the user scrolls down past it so it always remains in view right at the top of the page:

position:fixed;top:0;left:0;width:100%;height:40px;

My problem is that when this happens, my model popup which i have positioned absolute using the offset top and left of the click trigger gets bumped down 40px. As if the absolute positioning is relative to my fixed nav bar. This is in chrome btw.

I have tried using jquery .position instead of .offset but i’m pretty sure jquery is just getting the offset of the parent then minusing it from the offset of the child so it hits the same bugg.

Not sure what to do here, its a bugg that i had not anticipated and one i cant seems to find a work around to, googling it is a terminology minefield. My best guess at the moment is to try to approximate position: fixed; with some combination of other positioning but its just like ‘ahhhhhhh’ cause this should not be happening in the first place.

Cheers,
Nick

2

I fixed it, it was just me being a donut.

Basically positioning something fixed dynamically makes the entire document jump up by the height of that element, not the absolute element jump down like i originally thought. By setting a height on my header equal to what it would be inclusive of my dynamically fixed nav bar, i can avoid any page jumping. Job is a gooden, just had to look very very closely at how the browser was behaving and not jump to ridiculous conclusions. Lesson in life right there.