позиция фиксированная и webkit переполнение касание проблема ios 7

У меня есть отзывчивый веб-сайт, который имеет панель меню в виде боковой панели (например, приложение FB), которая фиксируется через position: fixed; в правом углу. Пока это работает отлично, за исключением iOS7 в сочетании с -webkit-overflow-scrolling: touch;. Фиксированный элемент не остается в своем положении, причем он переходит в фиксированное положение после завершения прокрутки.позиция фиксированная и webkit переполнение касание проблема ios 7

У кого-нибудь из вас есть совет?

Благодаря

источник

2014-09-21 supersize

Как случайно, вы пытались добавить '-webkit-backface-visibility: hidden;', который исправил некоторые недавние «исправленные положения»: проблемы, которые я имел в webkit. –

@AndiNorth спасибо за вашу попытку. У меня нет доступа к iOS 7 atm, но он даст вам попробовать позже! – supersize

Я боролся с точно таким же вопросом в течение всего дня, заключение, да, есть ошибка, когда вы позиционируете элемент как «фиксированной» в контейнере с '-webkit-overflow-scrolling: нажмите 'в устройствах Apple. И я не мог найти работу. '-webkit-transform: translate3d (0,0,0)' nor '-webkit-backface-visibility: hidden' Внести изменения.

Так что, наконец, я получил его, выполнив сборку моей html-структуры, поэтому фиксированный элемент не находится в прокручиваемом контейнере, находится на верхнем уровне. Может быть, не идеально, если «тело» - это ваш прокручиваемый контейнер, но надеясь, что он пролил свет для возможного решения.

Расширение его упрощенный пример:

<body> 
    <sidebar></sidebar> 
    <div id="content-wrap"> 
     <article></article> 
     <footer></footer> 
    </div> 
</body>

И CSS будет выглядеть следующим образом:

sidebar{ position: fixed; } #content-wrap{ -webkit-overflow-scrolling: touch; }

В основном в нижней строке, не место, как фиксированный элемент, который существует в пределах прокручивающийся сенсорный контейнер. Вы должны принять его, если вы не хотите иметь дело с этой проблемой IOS.

источник

2014-11-25 11:33:32

Есть ли у вас какой-нибудь код, который бы соответствовал вашему ответу в качестве примера для пользователя, задающего вопрос? – Stewartside

Я был в состоянии решить эту проблему путем динамического изменения -webkit-overflow-scrolling стиля auto всякий раз, когда кнопка была вызвана, чтобы показать position: fixed DIV (который находится внутри контейнера прокрутки).

Я просто добавлю класс dont-scroll.

.container{ 
    overflow-x: scroll; 
    -webkit-overflow-scrolling: touch; 
} 
.container.dont-scroll{ 
    -webkit-overflow-scrolling: auto; /* The fix */ 
}

После position: fixed ДИВ скрыто (в моем случае, когда пользователь нажимает на кнопку «Отменить» на всплывающей модальный), я динамически удалить dont-scroll класс, чтобы включить плавную прокрутку еще раз.

источник

2017-09-21 17:13:17

позиция фиксированная и webkit переполнение касание проблема ios 7

ответ

Смежные вопросы