| 1234567891011121314151617181920212223242526272829303132333435363738394041 |
- <custom style="height:{{CustomBar}}px;">
- <bar class="fixed gradual-pink" style="height:{{CustomBar}}px;padding-top:{{StatusBar}}px;">
- <navigator class='action' open-type="navigateBack" delta="1" hover-class="none">
- <text class='icon-back'></text> 轮播图
- </navigator>
- </bar>
- </custom>
- <bar>
- <view class='action'>
- <text class='icon-title text-pink'></text> 全屏限高轮播
- </view>
- <view class='action'>
- <switch class='sm' bindchange='DotStyle'></switch>
- </view>
- </bar>
- <swiper class="screen-swiper {{DotStyle?'square-dot':'round-dot'}}" indicator-dots="true" circular="true" autoplay="true" interval="5000" duration="500">
- <swiper-item wx:for="{{4}}" wx:key>
- <image src="https://image.weilanwl.com/img/4x3-{{index+1}}.jpg" mode='aspectFill'></image>
- </swiper-item>
- </swiper>
- <bar class="margin-top">
- <view class='action'>
- <text class='icon-title text-pink'></text> 卡片式轮播
- </view>
- </bar>
- <swiper class="card-swiper {{DotStyle?'square-dot':'round-dot'}}" indicator-dots="true" circular="true" autoplay="true" interval="5000" duration="500" bindchange="cardSwiper" indicator-color="#8799a3" indicator-active-color="#0081ff">
- <swiper-item wx:for="{{4}}" wx:key class="{{cardCur==index?'cur':''}}">
- <view class='bg-img shadow-blur' style="background-image:url(https://image.weilanwl.com/img/4x3-{{index+1}}.jpg)"></view>
- </swiper-item>
- </swiper>
- <bar class="margin-top">
- <view class='action'>
- <text class='icon-title text-pink'></text> 堆叠式轮播
- </view>
- </bar>
- <view class="tower-swiper" bindtouchmove="towerMove" bindtouchstart="towerStart" bindtouchend="towerEnd">
- <view class='tower-item {{item.zIndex==1?"none":""}}' wx:for="{{towerList}}" wx:key style='transform: scale({{0.5+item.zIndex/10}});margin-left:{{item.mLeft*100-150}}rpx;z-index:{{item.zIndex}}'>
- <view class='bg-img shadow-blur' style="background-image:url({{item.url}})"></view>
- </view>
- </view>
|
