一排图片左右滑动如何实现？

邹胖胖

我想做到，页面中间有一排图片，以中间图片为中心，两边的图片依次斜向后排开，左右滑动的时候可以将左右的图片切到中间来，之前在中间的那种图片就被滑到左边或右边去，类似于图片轮播，但又不是那种效果，有点类似于扑克牌那种展现，只是我的可以滑动，滑动到最中间的才可以点击，请问如何实现？

liangyongfei

这种效果要自己实现！
我可以给你提供下思路
1. 图片横向排列，图片都在data组件中，list横向显示 图片 ，可以参考  http://docs.wex5.com/wex5-ui-question-list-2059/

2. 可以通过css  和 style 控制图片 的位置， 可以是绝对布局 + 相对布局 ，  也可以通过修改padding margin 实现图片拉近距离效果

3.通过动态修改图片 style 的 z-index  控制图片的层关系，实现图片覆盖的规律

4. 关于动态修改style 或 css ，可以通过bind-css 或 bind-style实现效果
http://docs.wex5.com/wex5-ui-question-list-2102

5.手动滑动的时候，判断滑动位置可以参考：
http://docs.wex5.com/wex5-app-question-list-2071/

6.根据滑动的位置 ，判断，调用data.netx()  或 data.prev()   前后切换当前行即可，  bind-style 可以设置当前行图片 显示z-index  最大， 其他行依次减小即可

data组件中第一个一个值，其他z-index  绑定这个值即可！！

代码循环修改data组件中的值就行了，样式自动感知变化的

邹胖胖

已实现，使用jQuery-jcImgScroll.js，案例：http://www.lanrenzhijia.com/pic/3855.html

liangyongfei

邹胖胖 发表于 2018-1-17 11:51
已实现，使用jQuery-jcImgScroll.js，案例：http://www.lanrenzhijia.com/pic/3855.html

嗯！欢迎分享下案例源码！  
大家参考下

ligaohu1

邹胖胖 发表于 2018-1-17 11:51
已实现，使用jQuery-jcImgScroll.js，案例：http://www.lanrenzhijia.com/pic/3855.html

你好，我还有个问题，当数据量超过几十条时，页面会卡住好长时间然后加载出来，后续滑动很顺畅，你有关于滑动前后分页加载的机制吗。

邹胖胖

ligaohu1 发表于 2018-2-24 10:20
你好，我还有个问题，当数据量超过几十条时，页面会卡住好长时间然后加载出来，后续滑动很顺畅，你有关于 ...

数据都有几十条了，就不建议使用这种方式了，浏览性差，数据翻页体验也差，你可以去看看swiper案例有没有你需要的

ligaohu1

邹胖胖 发表于 2018-2-24 16:25
数据都有几十条了，就不建议使用这种方式了，浏览性差，数据翻页体验也差，你可以去看看swiper案例有没有 ...

我就是用的swipper ，但是几十条数据生产卡片时间巨长

liangyongfei

ligaohu1 发表于 2018-2-26 11:26
我就是用的swipper ，但是几十条数据生产卡片时间巨长

因为没有这样的案例  ，要么按照我提供的思路自己实现
要么 使用第三方控件，..