Javascript Jquery offset在滚动时只返回一个数字

我有一个网页，我需要得到我的页面元素的当前顶部位置

我有一些div，每个div的高度都是

100%

，我在那里有我的内容

我想从最高层得到这些部门的职位，并与之合作。但当我这样做时，它只返回一个数字，并且在滚动时不会改变

这是我的代码：

HTML:

<header id="header">
   <div id="menu-div" class="container-full">
        <div class="container">
            <a href="#">TEST</a>
            <a href="#">TEST</a>
            <a href="#">Test</a>
            <a href="#">Test</a>
            <a href="#">Test</a>
            <a id="request-demo-a" class="pull-right" href="#">TEST demo</a>
            </div>
        </div>
   </header>


   <div id="first-div" class="center a-div">
   test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>
   </div>


   <div id="full-div" class="container a-div">

        test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>
        </div>

  <div id="other-div" class=" a-div">
  <br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/>

  </div>



  <div id="other-div" class=" a-div">
  <br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/>

  </div>

.a-div{
    height:100%;
}


#full-div{
    position:absolute;
    top:100%;
    width: 100%;
    height: auto;
    background: white;
    z-index:5;

}


#first-div{
    width:100%;
    height:100%;
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom: 0;
    margin: auto;
    color:white;
    z-index:-1;


}
#menu-div{
    background: white;
    padding:7px;
    position: fixed;
    z-index:10;
}


#menu-div .container a{
    margin-left: 15px;
    display:inline-block;
    font-size:large;
}

#request-demo-a{
    padding:5px;
    border: 2px solid #FF8000;
    color: white;
    text-shadow: none;
    background: orange;
    text-decoration: navajowhite;
}

#request-demo-a:hover, #request-demo-a:focus{
    background: #FF8000;
}

$(function(){
        /**start:Scroll*/
        $(document).scroll(function(){
         $("#request-demo-a").html($('#full-div').offset().top);
         /// I want this return current value of full-div!
         //And when it become equel 0 do something! (This is just example)

        });
        /**End: Scroll*/      
})

JavaScript（Jquery）：

<header id="header">
   <div id="menu-div" class="container-full">
        <div class="container">
            <a href="#">TEST</a>
            <a href="#">TEST</a>
            <a href="#">Test</a>
            <a href="#">Test</a>
            <a href="#">Test</a>
            <a id="request-demo-a" class="pull-right" href="#">TEST demo</a>
            </div>
        </div>
   </header>


   <div id="first-div" class="center a-div">
   test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>
   </div>


   <div id="full-div" class="container a-div">

        test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>test content here...<br/>
        </div>

  <div id="other-div" class=" a-div">
  <br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/>

  </div>



  <div id="other-div" class=" a-div">
  <br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/><br/>test content here...<br/>test content here...<br/>test content here...<br/>

  </div>

.a-div{
    height:100%;
}


#full-div{
    position:absolute;
    top:100%;
    width: 100%;
    height: auto;
    background: white;
    z-index:5;

}


#first-div{
    width:100%;
    height:100%;
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom: 0;
    margin: auto;
    color:white;
    z-index:-1;


}
#menu-div{
    background: white;
    padding:7px;
    position: fixed;
    z-index:10;
}


#menu-div .container a{
    margin-left: 15px;
    display:inline-block;
    font-size:large;
}

#request-demo-a{
    padding:5px;
    border: 2px solid #FF8000;
    color: white;
    text-shadow: none;
    background: orange;
    text-decoration: navajowhite;
}

#request-demo-a:hover, #request-demo-a:focus{
    background: #FF8000;
}

$(function(){
        /**start:Scroll*/
        $(document).scroll(function(){
         $("#request-demo-a").html($('#full-div').offset().top);
         /// I want this return current value of full-div!
         //And when it become equel 0 do something! (This is just example)

        });
        /**End: Scroll*/      
})

我想获得

#full div

的位置并使用它，当它等于0时，做一些事情（表示到达顶部时），对于其他div，我想在特定位置做一些事情

---

但是为什么

$（'#full div'）.offset（）.top

在滚动时只返回一个数字？

在滚动时偏移量不会改变，

offset（）

检索元素相对于文档的当前位置，并且整个文档都在滚动，所以实际上没有任何变化，元素仍然位于文档中完全相同的位置

如果要滚动距离，请使用

scrollTop

，然后将其与元素偏移量进行比较，以查看页面的滚动量是否与元素到文档顶部的距离相同

$(document).on('scroll', function(){

    var scrolled = $(window).scrollTop();
    var offset   = $('#full-div').offset().top;

    if ( offset <= scrolled ) {
       // element is scrolled to top or above
    }

});

$（文档）.on（'scroll'，function（）{
var scrolled=$（窗口）.scrollTop（）；
var offset=$（'#full div'）.offset（）.top；
如果（那么，你的意思是我应该在

上使用

？@Askion-不，我只是在

上使用了

，因为这是附加事件处理程序的首选方式，它与应答无关谢谢。另一个问题，当完整div到达（类似于）头时，我如何判断，做些什么呢？取决于“头”是什么是吗？好吧，所有元素都在同一个文档中，我真的不明白您如何将
#full div
滚动到
标题
，它们从不移动？