控制台中看大致看到是控制整体列表的margin-left
然后移动元素达到无限滑动
我按照这么做了,但可能方法不对,先margin-left再用jq的insertBefore
位移元素不过有明显的不连贯现象
想请问下各位这种滑动正确的思路是怎么样的
怪我咯2017-04-11 12:13:37
完全没有必要使用Jq ,jQ已经逐渐被淘汰的趋势了
这种轮播的效果实现并不复杂
我说说我的思路
1.划定3种class 一种active 就是被放大的 另一种则是普通的 g-box 还有一种就是两边半透明的class hidden
2.给每个盒子加 transition 动画
3.父级使用overflow hidden 内部镶嵌一个ul(也叫transition) ul 宽度很大将所有的li包裹
4.点击一个 盒子 将其 class 添加 上active ul计算 margin-left 的距离(负值) 让其滚动到对应的位置,计算被点击的盒子左右两边缘的盒子半透明,加上hidden
5.如何获取那个盒子被点击呢? 可以给盒子加上 data-index:x 通过dataset 获取盒子的索引
刚刚看了一下 uCould
思路是不一样的
他实际上并不是滚动,而是重渲
滚动的效果是模拟的,欺骗用户的眼睛
每点击一次,重新渲染所有5个盒子,并根据被点击的盒子,进行一次滚动,滚动完成之后又马上恢复原来的位置