showing results for - "jquery fixed element on scroll footer"
Juan Pablo
14 Aug 2020
1var socialFloat = document.querySelector('#social-float');
2var footer = document.querySelector('#footer');
3
4function checkOffset() {
5  function getRectTop(el){
6    var rect = el.getBoundingClientRect();
7    return rect.top;
8  }
9  
10  if((getRectTop(socialFloat) + document.body.scrollTop) + socialFloat.offsetHeight >= (getRectTop(footer) + document.body.scrollTop) - 10)
11    socialFloat.style.position = 'absolute';
12  if(document.body.scrollTop + window.innerHeight < (getRectTop(footer) + document.body.scrollTop))
13    socialFloat.style.position = 'fixed'; // restore when you scroll up
14  
15  socialFloat.innerHTML = document.body.scrollTop + window.innerHeight;
16}
17
18document.addEventListener("scroll", function(){
19  checkOffset();
20});