Question

当窗口滚动位置大于div的底部位置时，我需要隐藏div。我试图自己做，但我做错了。还有另一个问题，因为我需要更好的代码文本比率来提交这个问题。为什么我提醒（）; img_top会说对象对象吗？

＆＃13;

$(document).ready(function(){
	var img_height = $("#head").outerHeight();
	var img_top = $("#head").offset();
  var img_bot = img_height + img_top;

  $(window).scroll(function(){
  	var wind_pos = $(window).scrollTop();
  	$("p").html(wind_pos);
    
    if(wind_pos > img_bot){
  	$("#head").addClass("hide");
  }
  });
});

＆＃13;

*{
  margin: 0;
  padding: 0;
}

body{
  height: 4000px;
}

#head{
  height: 600px;
  background-color: blue;
}

.hide{
  display: none;
}

p{
  background-color: yellow;
  width: 100%;
  height: 50px;
}

＆＃13;

<div id="head">

</div>
<p>
</p>
<script
  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>

＆＃13;

Answer 1

jQuery.offset()返回表示匹配元素位置的对象，您可以阅读它的top属性。

＆＃13;

$(document).ready(function() {
  var img_height = $("#head").outerHeight();
  var img_top = $("#head").offset().top;
  var img_bot = img_height + img_top;

  $(window).scroll(function() {
    var wind_pos = $(window).scrollTop();
    $("p").html(wind_pos);

    if (wind_pos > img_bot) {
      $("#head").addClass("hide");
    }
  });
});

＆＃13;

* {
  margin: 0;
  padding: 0;
}

body {
  height: 4000px;
}

#head {
  height: 600px;
  background-color: blue;
}

.hide {
  display: none;
}

p {
  background-color: yellow;
  width: 100%;
  height: 50px;
}

＆＃13;

<div id="head">

</div>
<p>
</p>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

＆＃13;

Answer 2

img_top

是一个对象，因为

$("#head").offset();

返回一个具有顶部和左侧偏移的对象，你必须使用

$("#head").offset().top

计算中的

当窗口滚动位置较大时，将div设置为none

2 个答案: