javascript - Swipeview - 显示下一项的预览/片段？

Question

我正在使用 Swipeview ( http://cubiq.org/swipeview ) 创建可在 iPhone 和 Android 上运行的触控式 carousel。基础知识非常有用。

当我尝试让它默认显示下一张幻灯片的 25% 时，我的问题就开始了。这个想法是用户可以看到下一张幻灯片/图像的 1/4，然后应该让他们滑动图像以显示下一张幻灯片/图像。然后第一个图像消失，第二个图像变为 100% 可见，向左对齐，然后第三个图像以 1/4 可见。等等。

我尝试将 div.style.cssText(在 swipeview.js 中)更改为宽度为 75% 而不是默认 100%。这适用于初始加载，但当我滚动时，第二张图片在幻灯片 1 上可见的部分现在隐藏在幻灯片 2 上。

我做了一个 fiddle 来演示:http://jsfiddle.net/zeqjN/1/ (在 Chrome 中测试并尝试将图像向左拖动)

关于如何修改 swipeview.js 以满足我的需要有什么想法吗？

Answer 1

您只能使用 css 实现此目的。只需在项目上添加比例效果即可。

.scroller .scroll-item { float: left; -webkit-transform: scale3d(1.1,1.1,1.1) }

查看: http://jsfiddle.net/frapporti/Xt9dM/