jQuery Mobile中的轮播画廊

7

我希望在jQueryMobile中做出像这样的效果:

旋转木马

我只需要一个滑块和指示当前选定页面的标识符,它应该显示一些图片。

所以我测试了很多图片库。但是大多数都有以下问题:

a) 初始界面为缩略图或 b) 与jQuery Mobile不兼容。

有人知道简单开始的方法吗?


2
Nivo滑块现在已经是响应式的了,但不确定是否达到了100%的效果。我个人使用了带有jQuery Mobile的Flex滑块,它的表现非常好- http://www.woothemes.com/flexslider/flexslider-demo/ - martincarlin87
1
这很有趣... http://swipejs.com/ - Nirmal Patel
我支持@martincarlin87的观点。我也在使用flexslider,它基本上是响应式的(你需要稍微调整一下CSS),此外我还成功地用“原生”的JQM元素替换了滑块控件,所以我的点是仅带图标的按钮(没有图标)等。 - frequent
2
Photoswipe可能是你想要的,它支持jquery移动端(请查看演示示例)。 - chrisben
你也可以尝试使用Bootstrap-carosel.css,它与此功能非常兼容。 - Learner
显示剩余3条评论
4个回答

3

Cubiq的Swipeview非常好,轻量级且响应迅速。

它拥有你所需的功能,没有多余的功能。在我测试的所有滑块中,这是迄今为止最具响应性的。

要使其与jQM配合使用,您有三个选项:

  1. 在jQM之前初始化
  2. 将其包装在pageshow中
  3. 将其放置在iFrame中

在iPhone 5s上尝试了链接中的演示,这个看起来很酷!通过向左或向右滑动操作。 - A.W.

2

Bootstrap默认带有一个很好的轮播组件。结合自定义的css,它可以发挥惊人的效果。它具有缩略图选项,我相信它可以与jQuery Mobile兼容。

您可以使用以下链接查看:

Bootstrap轮播组件


在 iPhone 5s 上尝试了一下,看起来很酷,但是滑动不起作用或不受支持。您必须按左/右箭头。 - A.W.

1

ItemSlide.js是一个非常适合移动设备的走马灯插件,它简单易用且体积小!您可以在此处找到演示和文档:http://itemslide.github.io/


0

Slick slider 是一个很好的小插件,而且相当可定制化。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接