如何使用jQuery获得相对于屏幕大小的50％？

Question

这就是我所拥有的

$(window).scroll(function(){
  var y = $(window).scrollTop();

  if (y > 400 & y < 10000) {
    $("#font").css("top", 0 + $(window).scrollTop());
  }
});

400应该是屏幕尺寸的50％。 和10000 100％

Answer 1

您可以使用窗口对象的innerHeight （或使用outerHeight获取完整的浏览器窗口的高度）属性来确定屏幕尺寸。 这将返回页面可见部分的高度：

$(window).scroll(function(){
  var y = $(window).scrollTop();

  var intViewportHeight = window.innerHeight;

  if (y > (intViewportHeight * 0.5) & y < (intViewportHeight * 1)) {
    $("#font").css("top", 0 + $(window).scrollTop());
  }
});

PS：您显然可以省略第二个公式的* 1部分。 我只是用它来澄清100％