In IOS8 Safari there is a new bug with position fixed.
If you focus a textarea that is in a fixed panel, safari will scroll you to the bottom of the page.
This makes all sorts of UIs impossible to work with, since you have no way of entering text into textareas without scrolling your page all the way down and losing your place.
Is there any way to workaround this bug cleanly?
#a { height: 10000px; background: linear-gradient(red, blue); } #b { position: fixed; bottom: 20px; left: 10%; width: 100%; height: 300px; } textarea { width: 80%; height: 300px; }
<html> <body> <div id="a"></div> <div id="b"><textarea></textarea></div> </body> </html>
The most common reason for Stuck Safari Browser on iPhone is due to the Safari Cache being clogged up with outdates files. 1. Open Settings > scroll down and tap on Safari.
An element can be focused by either using the autofocus="true" attribute or calling the element. focus() method. In both cases, the browser will automatically scroll the element into the viewport.
The -webkit-overflow-scrolling CSS property controls whether or not touch devices use momentum-based scrolling for a given element.
If you use an external keyboard, ⌘ cmd ↓ will scroll to the bottom of the page, and ⌥ opt ↓ will scroll one page down.
Based on this good analysis of this issue, I've used this in html
and body
elements in css:
html,body{ -webkit-overflow-scrolling : touch !important; overflow: auto !important; height: 100% !important; }
I think it's working great for me.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With