獲取元素位置scrollTop

Question

我有一個頁面佈局，我想在窗口scrollTop上顯示幾個元素，但是我在計算元素位置時遇到了問題。 這是我正在做的事情，但我得到我的scrollTop負值，我不知道爲什麼。

var myEl = $('.myElement').offset().top; 
 
var currPos = (myEl - $(window).scrollTop()); 
 

 

 
$(window).scroll(function(){ 
 
    var wScrollTop = $(window).scrollTop(); 
 
    
 
    if (wScrollTop > currPos) { 
 
    alert("reached"); 
 
    myEl.fadeIn(2000); 
 
    } 
 
});

body { 
 
    background-color: red; 
 
    height: 3000px; 
 
} 
 

 
.myElement { 
 
    color: #fff; 
 
    display: none; 
 
}

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

 

 
<p>Some othe content</p> 
 

 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
     
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto ullam minima, veniam, maiores molestiae assumenda pariatur corrupti voluptatum id ea commodi aperiam dignissimos fuga, exercitationem illo eius praesentium suscipit. Velit.</p> 
 

 
<div class="myElement">My Element</div>

我想只有一次運行該代碼不喜歡在我的例子很少的時間提醒已到達的位置。另外我不知道計算我的元素的currPos。任何建議，這是最好的方式如何計算元素的當前位置，然後在窗口滾動頂部只顯示一次我想要的元素。

Answer 1

這是更新的腳本。

jQuery(document).ready(function() { 
    var myEl = jQuery('.myElement'); 
    var myElem = myEl.offset().top-100; 
    $(window).scroll(function(){ 
     var wScrollTop = $(window).scrollTop(); 

     if (wScrollTop > myElem) { 
     myEl.fadeIn(2000); 
     } else { 
     myEl.fadeOut(2000); 
     } 
    }); 
    });