Не удается активировать выбор с помощью Flexslider / SwipeJS на Android / Gingerbread

Недавно я закончил создание мобильного сайта и обнаружил ошибку, которая, кажется, возникает только в Android Gingerbread.

Когда выбранный ввод помещается на слайд внутри JS-слайдера (например, Flexslider или SwipeJS), вы больше не можете щелкнуть его или сфокусировать его и выбрать параметры.

Мне интересно, связано ли это с использованием режима display none / block, который используют оба этих ползунка - возможно, Gingerbread не может правильно отобразить выбор в этих обстоятельствах? Интересно, что первый слайд с использованием SwipeJS работает; другие нет.

Я опубликовал несколько тестов в Интернете, чтобы продемонстрировать:

http://playground.iamkeir.com/slider-flexslider1-select

http://playground.iamkeir.com/slider-flexslider2-select

http://playground.iamkeir.com/slider-swipjs-select

Для справки, в примере я использую Flexslider 2 Beta, хотя такая же проблема возникает и с Flexslider 1.

https://github.com/woothemes/FlexSlider

https://github.com/woothemes/FlexSlider/tree/FlexSlider2

http://swipejs.com/

Прекрасно работает на Android Icecream Sandwich, iPhone - даже на Blackberry.

Я возился с этим то и дело в течение нескольких дней, и я просто не могу сузить круг вопросов.

Кто-нибудь может помочь, пожалуйста?


mobile android select flexslider android-2.3-gingerbread
person iamkeir    schedule 01.05.2012    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Так что мне любезно дал совет парень, создавший Flexslider, Тайлер Смит:

«Вы пробовали отключить использование translate3d? UseCSS: false и посмотреть, возникает ли ошибка по-прежнему? Translate3d является общим знаменателем для swipe / flex и иногда ведет себя странно».

Он был прав - это действительно исправило его, хотя это вызвало другую ошибку с Flexslider (обновление: которое он недавно исправил).

Так что будьте осторожны с translate3D- и CSS-анимациями в Android ‹4.x, см. Здесь: http://daneden.me/2011/12/putting-up-with-androids-bullshit/

Итак, чтобы исправить это, я буду нацеливаться на Android ‹4.x с useCSS: false.

Обратите внимание, что useCSS - это атрибут в бета-версии Flexslider 2, который все еще находится в стадии тестирования и разработки, поэтому используйте его с осторожностью.

Большое спасибо Тайлеру!

Ссылка:

http://playground.iamkeir.com/slider-flexslider2-select/

https://github.com/woothemes/FlexSlider/tree/FlexSlider2

person iamkeir    schedule 03.05.2012
comment
Спасибо, приятель, ты спас мою задницу .. !! - person Miuranga; 09.04.2013

arrow_upward
4
arrow_downward

Если метод useCSS: false не работает, я обнаружил, что удаление -webkit-backface-visibility: hidden; из файла flexslider.css исправляет его.

Это может означать, что переход flip не будет работать должным образом. Не тестировал.

person Nic Barbier    schedule 03.12.2012
comment
Спасибо за вклад, я тоже попробую. - person iamkeir; 09.04.2013