offsetTop vs. jQuery's position()

by Lucas Krause

HTML

<p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p><p>A</p>
<div class="a">
    <div class="b"></div>
</div>

CSS

.a {
    position:fixed;
    overflow:scroll;
    height:100%;
    width:100%;
    top:0;
    left:0;
    background-color:#000;
    opacity:.5;
}
.b {
    height:200%;
    width:50%;
    margin:0 auto;
    background-color:#FFF;
}

JavaScript

$(".b").bind("click", function(){
    //$(".a").css("overflow", "hidden");
    console.log($(this).position().top, this.offsetTop);//-$(window).scrollTop());
});