Question

我有一个页面布局，我想在窗口scrollTop上显示几个元素，但我有计算元素位置的问题。以下是我正在做的事情，但我将我的scrollTop设为负值并且我不知道为什么。

＆＃13;

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);
   }
});

＆＃13;

body {
  background-color: red;
  height: 3000px;
}

.myElement {
  color: #fff;
  display: none;
}

＆＃13;

<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>

＆＃13;

我想只运行一次此代码，而不是像我的示例那样，几次警告到达位置。我也不确定计算我的元素的currPos。任何建议，这是如何计算元素的当前位置，然后在窗口滚动顶部显示只有我想要的元素的最佳方法。

Answer 1

这是更新的脚本。

{{1}}

获取元素位置scrollTop

1 个答案: