<view class="cu-custom" style="height:{{CustomBar}}px;">
  <view class="cu-bar 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>
  </view>
</view>
<view class="cu-bar">
  <view class='action'>
    <text class='icon-title text-pink'></text> 全屏限高轮播
  </view>
  <view class='action'>
    <switch class='sm' bindchange='DotStyle'></switch>
  </view>
</view>
<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>
<view class="cu-bar margin-top">
  <view class='action'>
    <text class='icon-title text-pink'></text> 卡片式轮播
  </view>
</view>
<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>

<view class="cu-bar margin-top">
  <view class='action'>
    <text class='icon-title text-pink'></text> 堆叠式轮播
  </view>
</view>
<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>
