实践:swiper的引入
来自CloudWiki
swiper
scene.js:
<swiper class = "scene-template" display-multiple-items="模板:2">
<swiper-item> <view class="scene-item" > <img class="scene-item-cover"src="" mode="aspectFit"> </view> </swiper-item> <swipter-item> </swiper-item>
scene.css:
.scene-item { height: 180rpx;
}
.scene-item-cover { width:100%; height:100%;
}
循环展示:
<swiper class = "scene-template" circular="模板:True" display-multiple-items="模板:2">
<swiper-item> <view class="scene-item" > <img class="scene-item-cover"src="" mode="aspectFit"> </view> </swiper-item> <swipter-item> </swiper-item>
图片之间无缝衔接:
<swiper class = "scene-template" circular="模板:True" previous-margin="100rpx" next-margin="100rpx" display-multiple-items="模板:2">
<swiper-item> <view class="scene-item" > <img class="scene-item-cover"src="" mode="aspectFit"> </view> </swiper-item> <swipter-item> </swiper-item>
scene.css:
.scene-item { height: 180rpx; margin:0 10 rpx;
}
.scene-item-cover { width:100%; height:100%;
}