javascript - iOS 8 Page Jumping on Input Focus -

on ios 8's safari, when focus on <input> element, entire page jumps down suddenly, before returning original position. page layout fills entire screen , not intended scrolled.

you can observe jerkiness on idevice running ios 8, on our webapp @ https://weminder-app-demo.storycloud.co (click "sign up" in upper right corner find inputs focus, such "email" or "password" input). (i used 5th-generation ipod touch.)

this seems same bug observed here , here, , in this video. solutions in situations cordova apps, not building cordova app, making website mobile safari.

i've tried adding html, body { position: fixed; } suggested here, didn't work.

i try "disable scrolling" ontouchmove suggestion many people have provided before, not scrolling triggered user, automatic scrolling.

i've tried adding onfocus="window.scrollto(0, 0);" suggested here, didn't work, , wouldn't expect given comment on answer:

this seems should work, it's not working me on iphone 5s ios 8 in safari. event.preventdefault() in combination solution seems work, still default scrolling behavior. – benny mar 17 @ 17:53

how prevent bounce?

try this, in case worked:

$(document)     .on('focus', 'input', function(e) {         $('body').addclass('fixfixed');     })     .on('blur', 'input', function(e) {         $('body').removeclass('fixfixed');     }); } 

in case transform fixed element on web on absolute fix problem in ios when focus on input:

$(document)     .on('focus', 'input', function(e) {         $('body').addclass('fixfixed');         $('*').filter(function() {             return $(this).css("position") === 'fixed';         }).addclass('fixfixed');     })     .on('blur', 'input', function(e) {         $('body').removeclass('fixfixed');         $('*').filter(function() {             return $(this).css("position") === 'fixed';         }).removeclass('fixfixed');     }); } 

the class fixfixed have position: absolute !important;

i think first solution case should work