小程序
小游戏
企业微信
微信支付
扫描小程序码分享
- 需求的场景描述(希望解决的问题)
小程序支持反方向滚动
- 希望提供的能力
默认的 autoplay 是从左到右滚动,能否支持从右往左滚动
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
需求场景是怎样的,要实现什么功能?
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
类似陈列墙,有的 swiper 是从左到右滚动,有的 swiper 是从右到左滚动
外层 swiper 容器旋转 180 度, 内层 swiper-item 在旋转 180 度即可实现反向滚动。亲测可用。
<swiper class="swiper-container" circular="{{true}}" autoplay="{{true}}" bindanimationfinish="animationFinish" interval="2000" > <swiper-item wx:for="{{list}}" class="swiper-item-container" wx:key="index"> <view class="swiper-item"> <image class="avatar" src="{{item.profileUrl}}"></image> </view> </swiper-item> </swiper> .swiper-container { transform: rotate(180deg); // ... } .swiper-item { transform: rotate(180deg); // ... }
通过this.setData({current: this.data.current + 1}); 实现就可以了
啧啧。。你咋这么妖娆。。关了autoplay,自己setTimeout或者interval来设置current吧
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
需求场景是怎样的,要实现什么功能?
类似陈列墙,有的 swiper 是从左到右滚动,有的 swiper 是从右到左滚动
外层 swiper 容器旋转 180 度, 内层 swiper-item 在旋转 180 度即可实现反向滚动。亲测可用。
<swiper class="swiper-container" circular="{{true}}" autoplay="{{true}}" bindanimationfinish="animationFinish" interval="2000" > <swiper-item wx:for="{{list}}" class="swiper-item-container" wx:key="index"> <view class="swiper-item"> <image class="avatar" src="{{item.profileUrl}}"></image> </view> </swiper-item> </swiper> .swiper-container { transform: rotate(180deg); // ... } .swiper-item { transform: rotate(180deg); // ... }
通过this.setData({current: this.data.current + 1}); 实现就可以了
啧啧。。你咋这么妖娆。。关了autoplay,自己setTimeout或者interval来设置current吧