在Android/Gingerbread上使用Flexslider/SwipeJS无法激活选择功能[英] Can't activate select using Flexslider/SwipeJS on Android/Gingerbread

本文是小编为大家收集整理的关于在Android/Gingerbread上使用Flexslider/SwipeJS无法激活选择功能的处理/解决方法,可以参考本文帮助大家快速定位并解决问题,中文翻译不准确的可切换到English标签页查看源文。

问题描述

我最近完成了一个移动网站,发现了一个仅在Android Gingerbread上发生的错误.

When a select input is placed on a slide within a JS slider (such as Flexslider or SwipeJS), you can no longer click it or give it focus and select the options.

我想知道这两个滑块都使用的note/block是否与使用 - 也许在这种情况下无法正确渲染选择?有趣的是,使用SwipeJS的第一辆幻灯片是功能性的.其他不是.

我在线弹出了一些测试以演示:

http://playground.iamkeir.com/slider-flexslider-flexslider1-slect1-select /p>

http://playground.iamkeir.com/slider-flexslider-flexslider2-slect2-select2-select /p>

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

供参考,我在示例中使用Flexslider 2 Beta,尽管Flexslider 1.

发生了同样的问题

https://github.com/woothemes/woothemes/flexslider

/p>

http://swipejs.com/

在iPhone的Android冰淇淋三明治上正常工作 - 甚至是黑莓.

我已经摆弄了几天,我似乎无法缩小它.

请任何帮助吗?

推荐答案

所以我从建造Flexslider的Chap的建议中得到了一些建议,泰勒·史密斯:

"您是否尝试过禁用翻译3D的使用?usecss:false,看看是否仍然发生了错误?translate3d是在滑动/flex之间的一个共同点,有时表现出奇怪的行为."

>

他是对的 - 确实确实修复了它,尽管flexslider造成了不同的错误(更新:他最近修复了).

因此,请务必translate3d-和CSS动画在Android <4.x中,请参见此处: http://daneden.me/2011/12/putting-up-with-with-androids-bullshit/

因此,要解决,我将用USECSS来定位Android <4.x:false.

请注意,USECSS是Flexslider 2 Beta中的一个属性,它仍在测试和开发中,因此请谨慎使用.

非常感谢泰勒!

参考:

http://playground.iamkeir.com/slider.com/slider-flexslider-flexslider2-slect/a >

/p>

其他推荐答案

如果useCSS: false方法不起作用,我发现从flexslider.css文件中删除-webkit-backface-visibility: hidden;.

这可能意味着flip过渡无法正常工作.尚未测试.

本文地址:https://www.itbaoku.cn/post/102637.html

问题描述

I've recently finished building a mobile site and discovered a bug that only seems to occur on Android Gingerbread.

When a select input is placed on a slide within a JS slider (such as Flexslider or SwipeJS), you can no longer click it or give it focus and select the options.

I'm wondering if it has to do with the use of display none/block which both these sliders use - perhaps Gingerbread cannot render the select properly under these circumstances? Interestingly, the first slide using SwipeJS is functional; the others not.

I've popped a few tests online to demonstrate:

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

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

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

For reference, I'm using Flexslider 2 Beta in the example, although the same issue occurs with Flexslider 1.

https://github.com/woothemes/FlexSlider

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

http://swipejs.com/

Works fine on Android Icecream Sandwich, iPhone - even Blackberry.

I've been fiddling with this on and off for days now and I just can't seem to narrow it down.

Can any one assist please?

推荐答案

So I was kindly given some advice from the chap who built Flexslider, Tyler Smith:

"Have you tried disabling the use of translated3d? useCSS: false, and seeing if the error still occurs? translate3d is a common denominator between swipe/flex, and behaves strangely sometimes."

He was right - that did indeed fix it, although it caused a different error with Flexslider (update: which he has recently fixed).

So beware translate3D - and CSS animations in Android < 4.x, see here: http://daneden.me/2011/12/putting-up-with-androids-bullshit/

So, to fix, I will be targeting Android < 4.x with useCSS: false.

Please note useCSS is an attribute in Flexslider 2 Beta, which is still in testing and development, so use with caution.

Big thank you to Tyler!

Ref:

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

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

其他推荐答案

If the useCSS: false method doesn't work, I found that removing -webkit-backface-visibility: hidden; from the flexslider.css file fixes it.

This may mean that the flip transition won't work as expected though. Haven't tested.