$ ("# id"). ScrollTop() возвращает null

Question

Я пытаюсь получить позицию coulpe на моей странице html с помощью метода scrollTop(), чтобы сравнить его с положением пользователя, но это только возвращает null. Вот код:

<div id="div1" class="transition"> 
    <img src="bg1.jpg"/> 
</div> 

<div id="div2" class="transition"> 
    <img src="bg2.jpg"/> 
</div> 

и JavaScript:

var t1 = $('#div1').scrollTop(); 
var t2 = $('#div2').scrollTop(); 

console.log(t1 + " " + t2); 

и печатает t1 и t2 = NULL. Вы видите, где проблема?

Answer 1

Эти div s не скроллбары (я предполагаю), поэтому они, естественно, не может быть прокручивается.

Если вы хотите, чтобы найти позицию, которую нужно прокручивать так, что они находятся на вершине, попробуйте:

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

(jQuery docs)

Вот рабочий пример:

---

var txt = $('#div1').offset().top + ' ' + $('#div2').offset().top; 
 

 
document.getElementById('output').appendChild(document.createTextNode(txt));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div id='div1'> 
 
    This is some stuff 
 
</div> 
 

 
<div id='div2'> 
 
    More stuff 
 
</div> 
 

 
<div id='output'></div>

Answer 2

использование .position().top получить позицию на странице:

FIDDLE

Answer 3

Попробуйте обернуть все это в готовом документе документе. Ваш javascript может работать до того, как dom завершит загрузку.

$(document).ready(function(){ 
    var t1 = $('#div1').scrollTop(); 
    var t2 = $('#div2').scrollTop(); 
    console.log(t1 + " " + t2); 
});