虽然官方提供了引导页插件但是如何自己实现一个引导页功能呢???
我特么要自己比赛现成离线手撸,,,所以要自己来实现》?》》
使用css绝对定位设置父级宽高,然后子级图片百分百,这样就可以把整个swiper撑开了
<template>
<view>
<swiper class="a" indicator-dots="ture">
<swiper-item>
<image src="../../static/111.jpeg"></image>
</swiper-item>
<swiper-item>
<image src="../../static/welBg.png"></image>
</swiper-item>
<swiper-item>
<image src="../../static/111.jpeg"></image>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
.a {
position: absolute;
width: 750rpx;
height: 1536rpx;
}
image {
height: 100%;
width: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
</style>
实现效果图:
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。