/Javascript/jQuery/Jquery fixed element on scroll footer

Jquery fixed element on scroll footer

var socialFloat = document.querySelector('#social-float');
var footer = document.querySelector('#footer');

function checkOffset() {
  function getRectTop(el){
    var rect = el.getBoundingClientRect();
    return rect.top;
  }
  
  if((getRectTop(socialFloat) + document.body.scrollTop) + socialFloat.offsetHeight >= (getRectTop(footer) + document.body.scrollTop) - 10)
    socialFloat.style.position = 'absolute';
  if(document.body.scrollTop + window.innerHeight < (getRectTop(footer) + document.body.scrollTop))
    socialFloat.style.position = 'fixed'; // restore when you scroll up
  
  socialFloat.innerHTML = document.body.scrollTop + window.innerHeight;
}

document.addEventListener("scroll", function(){
  checkOffset();
});

Source: stackoverflow.com

Similar codes

1 vote335 views1 answer
Remove tr having delete icon inside jquery
Javascript jQuery
1 vote301 views1 answer
Jquery wait for all ajax requests to complete
Javascript jQuery
0 vote298 views1 answer
If path name is different but parent nav should be active in jquery
Javascript jQuery
6 votes316 views3 answers
Jquery remove and add class
Javascript jQuery
2 votes275 views2 answers
Jquery ajax get with authentication
Javascript jQuery
0 vote297 views1 answer
Prepend option on 2nd index jquery
Javascript jQuery
1 vote288 views1 answer
Jquery link
Javascript jQuery
0 vote358 views1 answer
JQuery.datepicker is undefined
Javascript jQuery
15 votes327 views1 answer
Flash a button jquery onclick
Javascript jQuery
0 vote319 views1 answer
Bootstrap searchable pagination table example jquery
Javascript jQuery