Слайдер SlidesJS медленный и нервный на iOS - PullRequest
0 голосов
/ 29 февраля 2012

У меня есть сайт с ползунком. Слайдер содержит несколько фотографий, а также скрытые видео. При нажатии на определенные «удерживающие кадры» картинка скрывается, и затем видео начинает воспроизводиться.

Это прекрасно работает на компьютере и во всех браузерах. Но как только я попробую это на iOS, анимация перехода будет очень медленной и иногда вообще не будет происходить. Часто на iPad нет перехода вообще. Только секунда черного пространства, затем новый слайд.

Я перестроил ползунок на тестовом сервере только с ползунком. Он точно такой же, как на моем сайте, но это единственное на странице. Когда я смотрю это с iOS, это прекрасно работает! Переходы плавные и как я их задумал.

Так что это наводит меня на мысль, что на моем исходном сайте может быть что-то еще, что мешает переходам, но только на iOS ...

Вы можете посмотреть сайт здесь. http://optidesign.squarespace.com/projects/motorola-sf700.html

Если кто-нибудь может пойти дальше и взглянуть на попытку и дать мне некоторое представление, это было бы здорово. В противном случае моя идея состоит в том, чтобы медленно перестроить сайт на моем тестовом сервере и проверить, где он ломается. Или попробуйте другие слайдеры, но Slidesjs работал лучше всего для меня.

Спасибо

РЕДАКТИРОВАТЬ: Я только что заметил еще один интересный момент. Если вы нажмете «удерживать» и покажете видео, переход от этого слайда к следующему будет плавным! Но возвращение все еще сломано, а остальные слайды остаются сломанными ...

Редактировать: Никто не знает, что может быть причиной этого?

1 Ответ

0 голосов
/ 03 июля 2012

Насколько я понимаю, чем больше элементов в DOM, тем медленнее JavaScript будет манипулировать DOM, особенно при физическом переводе / перемещении элементов. Это объясняет, почему слайдер работает хорошо сам по себе, но спотыкается на месте.

Я бы настоятельно рекомендовал использовать CSS-переходы для достижения желаемого эффекта. Проверьте этот инструмент: http://www.idangero.us/sliders/swiper/

CSS transition в сочетании с transform3d позволяет аппаратно ускорять "скольжение" элементов на iOS и очень плавно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...