我正在使用Swipeview(http://cubiq.org/swipeview)创建可在iPhone和Android上运行的支持触摸的carousel。基础知识很棒。

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

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

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

关于如何修改swipeview.js以适合我的需求的任何想法吗?

最佳答案

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

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

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

关于javascript - Swipeview-显示下一项的预览/摘要?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/11154031/

10-11 16:20