swiper
swiper item container. Only the swiper-item component can be placed in it, otherwise it will cause undefined problem.
Example
bxml
bxss:
js
#
PropsName | Type | Description | Default |
---|---|---|---|
indicator-dots | boolean | whether to display panel indicator points | false |
indicator-color | string | color of indicator | "rgba(0, 0, 0, .3)" |
indicator-active-color | string | color of active indicator | "#000000" |
autoplay | boolean | autoplay or not | false |
current | number | the index of current swiper | 0 |
interval | number | interval when using autoplay | 5000 |
duration | number | swipe animation duration | 500 |
circular | boolean | when last one finished, whether turn to the first one | false |
vertical | boolean | vertical or not(horizontal) | false |
previous-margin | string | exposing a small part of the previous item (child element setting width/height: 100%; set img's width/height: inherit) | "0px" |
next-margin | string | exposing a small part of the next item (child element setting width/height: 100%; set img's width/height: inherit) | "0px" |
snap-to-edge | boolean | When the number of swiper-items is greater than or equal to 2, circular is turned off and previous-margin or next-margin is turned on, you can specify that this margin is applied to the first and last element | false |
display-multiple-items | number | 1 | |
easing-function | EasingFunctionName | currently supported easingFunction: default,linear,easeInCubic,easeOutCubic,easeInOutCubic | "default" |
#
EventsName | Description |
---|---|
bindchange | The change event is fired when the current changes,event.detail = {current, source} |
bindtransition | The transition event is triggered when the position of the swiper-item changes,event.detail = {dx: dx, dy: dy} |
bindanimationfinish | Triggered when the animation finished,event.detail = {current, source} |