Задать вопрос
slowdream
@slowdream
html

Как побороть position:fixed на IOS?

Есть вертикальный блок на 100vh, при прокрутке до него он должен фиксироваться на экране и при прокрутке обратно до него возвращаться на свое место. Для этого использую плагин sticky.js Но position:fixed на IOS на стары смарфонах ведет себя не совсем адекватно.
Хорошее решение есть на хабре, но вместе с плагином оно не совсем совместимо.

На десктопе работает нормально только при прокрутке в низ, на мобильном "скачет", а если попытаться прокрутить обратно вверх, начинается вакханалия.

Пример ТУТ (на разрешении менее 750px)
  • Вопрос задан
  • 1323 просмотра
Комментировать
Подписаться 2 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 1
Boberdober
@Boberdober
Работающий говнокод. Может его использовать?

jQuery(function() {
        var box = jQuery('.example'); // float-fixed block
        var top = box.offset().top - parseFloat(box.css('marginTop').replace(/auto/, 0));
        jQuery(window).scroll(function(){
            var windowpos = jQuery(window).scrollTop();
            if(windowpos < top) {
                box.css('position', 'static');
            } else {
                box.css('position', 'fixed');
                box.css('top', 0);
            }
        });
    });
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик (React)
ДАЛЕЕ
от 130 000 ₽
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Установить Windows на Dedicated Server
16 апр. 2024, в 22:49
2500 руб./за проект
YOLO для распознания количества человек в очереди на кассу по видео ряду
16 апр. 2024, в 22:48
5000 руб./за проект
Скопировать и доработать нативное Java приложение на React Native
16 апр. 2024, в 22:44
5000 руб./за проект
Ещё заказы