Переход HTML5 на iPhone 4 - PullRequest
Новая
       11

Переход HTML5 на iPhone 4

1 голос
/ 18 октября 2011

Соответствующий вопрос был задан здесь: CSS3 или jQuery анимация с заданным шагом

Теперь я хотел бы спросить, есть ли переход (CSS3 или jQuery), который работает наiPhone 4 / iPad / iPad 2, позволяющий постепенно менять полноэкранные слайды (изображения или даже кадры, заполненные элементами управления) и достаточно быстрый, чтобы быть плавным?

С уважением,

1 Ответ

3 голосов
/ 24 января 2012

Для максимальной производительности на устройствах iOS, используйте translateZ (0) или translate3d (0,0,0) в вашем переходе / анимации, чтобы включить аппаратное ускорение через графический процессор.

подробнее здесь: http://www.html5rocks.com/en/tutorials/speed/html5/#toc-visual-fidelity

пример того, как вы бы это реализовали:

CSS 

.fadeOut{ -webkit-animation: fadeout 750ms; }
@-webkit-keyframes fadeout {
    0% { -webkit-transform: translateZ(0);
        opacity:1;
    }
    100% { -webkit-transform: translateZ(0);
        opacity:0;
    }       
}

.fadeIn{ -webkit-animation: fadein 750ms; }
@-webkit-keyframes fadein {
    0% { -webkit-transform: translateZ(0);
        opacity:0;
    }
    100% { -webkit-transform: translateZ(0);
        opacity:1;
    }       
}
...