Я использую плагин skrollr для создания веб-страницы параллакса для iOS. Если я просто использую текст, это очень плавно и очень быстро. Если я включаю фоновое изображение с помощью CSS или встроенное изображение с помощью HTML, прокрутка внезапно становится очень прерывистой. Это можно как-то исправить? Любое изображение сильно его тормозит.
Спасибо!
В зависимости от размера вашего фонового изображения, фоновые изображения css могут привести к высокой стоимости рендеринга любой страницы. Это переменная величина, но чем большую площадь вы покрываете фоном, тем выше затраты, поскольку механизму рендеринга для браузера необходимо перерисовывать большие части экрана. Вы можете увидеть это в действии, если используете Chrome и используете инструменты разработчика и инструменты временной шкалы.
Исправление для вашего конкретного случая анимации изображений, возможно, для выполнения 3D-преобразования CSS. IE не выполняет обычное преобразование, а выполняет трехмерное преобразование, такое как «translate3d». Это автоматически запустит аппаратный рендеринг (т. е. графический процессор вашего компьютера будет обрабатывать преобразование) и разгрузит ваш процессор, что теоретически сделает вашу анимацию более плавной.
Конечно, за это приходится платить, особенно если вы работаете с мобильными или другими ограниченными платформами. Но стоит попробовать.
background-attachment:fixed;. - person advert2013 schedule 24.04.2014-webkit-transform: translate3d(0,0,0);включить аппаратное ускорение? Возможно, этот поток SO есть ответ на вашу проблему. - person Mandy Schoep schedule 25.04.2014