'Mobile keyboard pops up, hiding input

I've got a problem with my mobile app. I've read and tried a couple of things to prevent mobile keyboard to hide an input (newsletter) on my footer but I can't find any solutions.

The problem appears on android smartphone using chrome. On safari it's working fine.

I notice the problem was caused because of that :

window.addEventListener('scroll', () => {
  if (window.innerHeight + window.pageYOffset >= document.body.offsetHeight) {
    footerUp.style.bottom = 0;
  } else{
    footerUp.style.bottom = '-22rem';
  }
});

I wanted a footer that appears only when user's scroll all the way down. But since the scrolling goes to the top when we press on the input my footer (and this is logic) then disappears.

I tried to set preventScroll:true when focus is triggered but it's not working.

Any suggestions ?

javascripthtml


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions