Я столкнулся с очень раздражающей проблемой только в iOS Safari 9+ (8.4 в порядке), где, как только пользователь быстро прокручивает страницу, в результате чего привязывающие ссылки в фиксированных элементах перестают быть кликабельными из-за внешнего вида и фактического щелчка/область ударов не выстраивается в линию со своим элементом, пока пользователь не прокручивается снова.
Это происходит не каждый раз, и может потребоваться несколько попыток "разбить" систему. Содержимое должно быть длиннее окна просмотра, чтобы это работало.
Обходных решений проблемы пока нет. Как я могу решить эту проблему?
ОБНОВЛЕНИЕ: После дальнейшего тестирования проблема возникает только с iOS Safari 9 и выше, протестированной на iOS 8, и проблем нет.
ОБНОВЛЕНИЕ 2: Теперь ясно, что это происходит на большинстве веб-сайтов с использованием position:fixed;
и даже position:-webkit-sticky;
. Вы можете проверить свое:)
HTML
<section>
<article></article>
<article></article>
<article></article>
</section>
<div class="sticky">
<a href=""></a>
</div>
CSS
html, body {
margin:0;
}
article {
display: block;
height: 200px;
width: 100%;
margin-bottom: 20px;
background: whitesmoke;
}
.sticky {
width:100%;
height:100px;
position: fixed;
bottom:0;
background: orange;
text-align:center;
}
.sticky a {
display: inline-block;
width: 100px;
height: 100px;
background: yellow;
}
http://codepen.io/toobulo/pen/dGEodo
Проблема не возникает в редакторе Codepen, так как это связано с изменениями размеров салона Safari и размерами панели инструментов. Пожалуйста, экспортируйте код на свою страницу или используйте следующую ссылку: