1

我想将 Javascript 轮播转换为在 iOS 设备 iPad 和 iPhone 以及使用能够利用 CSS 转换的硬件加速的 webkit 的 Android 设备上顺利运行。

是否已经有一个库或一些代码片段可以设置位置和大小？

我发现jquery.animate-enhanced可能很接近，但它需要动画，并且还进行特征检测 - 我想做一些更简单的事情，它看起来比这复杂得多。

我怀疑解决方案需要解决几个复杂问题：

- 简单重用代码以使用top/ leftCSS 属性或带有翻译的 CSS 转换（以及转换它们所需的任何重新计算）

- 使用比例变换而不是设置宽度和高度

设置步骤如下：

-设置-webkit-transform-style为preserve-3d

--webkit-transform-origin根据需要设置（以及如何设置？）

4

1 回答 1

0

我在标签中看到了 Zepto，所以您似乎已经考虑过它并且它没有工作？Zepto 的动画确实使用 CSS3。

我会尝试这样的事情作为第一个猜测。您需要在“animateLeft”方法之外进行特征检测，因为 jquery 和 zepto 之间的动画 api 不同。

也许是这样的（伪代码）：

isTouchy = Modernizr.touch

var slideRight = function() {
    if (isTouchy) {
        Zepto('#carosel').animate(...)
    } else {
        jQuery('#carosel').slideRight() //sorry, don't know the api
    }
}

http://zeptojs.com/#animate

http://modernizr.com/

于 2012-04-23T03:09:22.327 回答