К сожалению, в настоящее время нет хорошего решения проблемы отсутствия поддержки мобильных браузеров для position:fixed
. Причина, по которой position:fixed
в первую очередь «сломана», заключается в том, что - среди прочего - ни один поставщик браузеров не знает точно, как справиться с тем, что происходит при увеличении масштаба документа. Если у вас есть время для чтения, я настоятельно рекомендую следующие статьи, в которых подробно и кропотливо описываются области просмотра браузера и проблемы, связанные с позиционированием fixed
на мобильных устройствах:
- Сказка о двух видовых экранах & ndash; часть вторая & mdash; как работают viewports и проблема мобильных браузеров. (Если вы не знакомы с областями просмотра в настольных браузерах или хотите получить фоновую информацию, см. Также часть первая .)
- Пятое значение позиции делает фантастическую работу по объяснению проблем, связанных с
position:fixed
в мобильном браузере, и предполагает, что нам может понадобиться новое значение position
& ndash; device-fixed
.
В этих статьях вы найдете почему , но не как это исправить . Для действительно fixed
позиции вам в основном не повезло. Однако, если ваша цель состоит в том, чтобы закрепить панель инструментов ниже прокрутки контента, есть несколько способов взломать ее. У меня был успех с iScroll .
Редактировать: Правильный способ определить, работаете ли вы на сенсорном устройстве, - это обнаружение следующих функций:
var isTouch = ('ontouchstart' in window);
ontouchstart
- это событие, запущенное в мобильном браузере Safari и браузере Android . Его нет в настольных браузерах, где вы можете просто использовать overflow:auto
и иметь обычные полосы прокрутки. Если isTouch
истинно, вы можете использовать iScroll.