标签：分享 swipe hand 滑动动画 自动 cin tab .com chm
|
01
02
03
04
05
06
07
08
09
10
11
12
13
|
[/align]<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}"> <swiper-item> <image src="{{item}}" class="slide-image" width="355" height="150"/> </swiper-item> </block></swiper><button bindtap="changeIndicatorDots"> indicator-dots </button><button bindtap="changeAutoplay"> autoplay </button><slider bindchange="intervalChange" show-value min="500" max="2000"/> interval<slider bindchange="durationChange" show-value min="1000" max="10000"/> duration |
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
page({ data: { imgUrls: [ ], indicatorDots: false, autoplay: false, interval: 5000, duration: 1000 }, changeIndicatorDots: function(e) { this.setData({ indicatorDots: !this.data.indicatorDots }) }, changeAutoplay: function(e) { this.setData({ autoplay: !this.data.autoplay }) }, intervalChange: function(e) { this.setData({ interval: e.detail.value }) }, durationChange: function(e) { this.setData({ duration: e.detail.value }) }}) |
|
1
2
3
4
|
.swiper-item{ display: block; height: 150px;} |
|
属性
|
类型
|
默认值
|
描述
|
|
indicator-dots
|
Boolean
|
false
|
是否显示面板指示点
|
|
autoplay
|
Boolean
|
false
|
是否自动切换
|
|
current
|
Number
|
0
|
当前所在页面的 index
|
|
interval
|
Number
|
5000
|
自动切换时间间隔
|
|
duration
|
Number
|
1000
|
滑动动画时长
|
|
bindchange
|
EventHandle
|
current 改变时会触发 change 事件，event.detail = {current: current}
|
标签：分享 swipe hand 滑动动画 自动 cin tab .com chm
原文地址：http://www.cnblogs.com/johnchai/p/6637406.html
