简体   繁体   English

粘性div与jquery与停止点

[英]Sticky div with jquery with stop point

Trying to make a sticky banner in the right sidebar on http://lukich.co.nf/laestrella/ But can't figure out how to define it's stop point a few pixels before the red line above footer. 试图在http://lukich.co.nf/laestrella/的右侧边栏上制作粘性横幅但是无法弄清楚如何在页脚上方的红线之前定义几个像素的停止点。 Can someone help please. 请有人帮忙吗。 the script: 剧本:

$(function(){ // document ready
  if (!!$('#sticky').length) { // make sure "#sticky" element exists
  var el = $('#sticky');

  var stickyTop = $('#sticky').offset().top -100;

  $(window).scroll(function(){ // scroll event
      var windowTop = $(window).scrollTop(); 

      if (stickyTop < windowTop){
         el.css({ position: 'fixed', top: 50 });
      }
      else {
         el.css('position','static');
      }         

    });
  }
});

I visited mentioned the site and tried to give fix by using browser console. 我访问了提到的网站,并尝试使用浏览器控制台进行修复。 Please debug below code surely it will work. 请调试下面的代码肯定会起作用。 Just you have to analyse little bit. 只是你必须分析一下。

var el = $('#sticky');
var stickyTop = $('footer').offset().top;
$(window).scroll(function(){ 
var windowTop = $(window).scrollTop(); 
var z= $(window).height();
if ($(this).scrollTop() > 50) { 
   if(windowTop + z > stickyTop){
      $('#sticky').css('display','block');
   }
   else
   {
       $('#sticky').css('display','none');
    }
} 

}); });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM