javascript 和 jquery 分別實(shí)現(xiàn) 頁面右側(cè)信息模塊，在頁面一屏幕以下的位置，當(dāng)頁面滾動到該位置后，該模塊固定定位，當(dāng)頁面滑動到底部時，該模塊到footer頂部就取消固定定位

JavaScript 實(shí)現(xiàn)：

window.addEventListener("scroll", function(){
  var infoDiv = document.getElementById("info-module");
  var footer = document.getElementById("footer");
  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  var offsetTop = infoDiv.offsetTop;
  if(scrollTop > offsetTop && scrollTop < footer.offsetTop - window.innerHeight){
    infoDiv.style.position = "fixed";
    infoDiv.style.top = "0";
  } else if(scrollTop >= footer.offsetTop - window.innerHeight){
    infoDiv.style.position = "absolute";
    infoDiv.style.top = footer.offsetTop - infoDiv.clientHeight + "px";
  } else{
    infoDiv.style.position = "static";
  }
});

jQuery 實(shí)現(xiàn)：

$(window).scroll(function(){
  var infoDiv = $("#info-module");
  var footer = $("#footer");
  var scrollTop = $(window).scrollTop();
  var offsetTop = infoDiv.offset().top;
  if(scrollTop > offsetTop && scrollTop < footer.offset().top - $(window).height()){
    infoDiv.css({position: "fixed", top: "0"});
  } else if(scrollTop >= footer.offset().top - $(window).height()){
    infoDiv.css({position: "absolute", top: footer.offset().top - infoDiv.outerHeight() + "px"});
  } else{
    infoDiv.css("position", "static");
  }
});