Click on input field triggers window resize

I still have no idea why this happens (the resize), but I found a solution:

I am turning off the window resize on $('#search-container') click event:

$('#search-container').on('click', function(){
    $(window).off('resize');
});

Stops the window from resizing (which was causing the issue), and you can type on android with ease now :)

This is happening because the soft keyboard opens when the input element is clicked. Apparently resize triggers on a multitude of events, as described here: https://www.quirksmode.org/dom/events/resize_mobile.html.

Your solution works, but you could also use this approach, i.e.

$(window).on('resize', function(){
   // If the current active element is a text input, we can assume the soft keyboard is visible.
   if( $(document.activeElement).prop('type') !== 'text') {
      if ($(window).width() < 980) {
        $('#search-container').detach().insertAfter('#logo');
      } else {
        $('#search-container').detach().insertAfter('#main_menu');
      }
   } 
}