Advertisement
nicolaslagios

sticky form

Jan 14th, 2023
977
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. let form = document.querySelector("#wpcf7-f653-o1");
  2. let formPosition = form.getBoundingClientRect().top + window.scrollY;
  3. let mainNavHeight = document.querySelector('#main-nav').getBoundingClientRect().height;
  4. let formWidth = form.getBoundingClientRect().width;
  5. let formLeft = form.getBoundingClientRect().left;
  6.  
  7. window.addEventListener('scroll', function() {
  8.     let windowPosition = window.scrollY;
  9.  
  10.     if (windowPosition >= formPosition) {
  11.         form.style.left = formLeft + 'px';
  12.         form.style.position = 'fixed';
  13.         form.style.top = mainNavHeight + 'px';
  14.         form.style.zIndex = '9999';
  15.         form.style.width = formWidth + 'px';
  16.     } else {
  17.         form.removeAttribute("style");
  18.     }
  19. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement