all articles

fixed header cannot be clicked on landscape mode

2015-07-01 @sunderls

iOS7 safari fixed landscape js

description

iOS safari has many problems on fixed elements.

on iOS7, if you do something like fixed header, when you rotate it to landscape mode, the address bar will disappear automatically if you have scrolled a little before rotating. Well, if you click the very top, like close to the border, the address bar will be called out, which cause header to float down a little bit, and it is not tappable, and seems to be transparent for the touch event.

workaround

on iOS7, I've found that scrollBy(0,0) will do the trick. Funny huh? just do the following

if (isIOS7){
    $(window).one('touchstart.fixIO7', function(){
         window.scrollBy(0,0)
    })
}