<scroll-view scroll-y class="bg-wave">
<view class='bg'>
<view class='top'>
<view class='top-right' bindtap='toAnswer'>
<image src="../../../images/icons/lamp.svg" />
<text>答题积分</text>
</view>
<view class='top-container'>
<text>{{numbers}}</text>
<view class='container-top' bindtap='goDetail'>
<image src="../../../images/icons/Exclamatory-mark.svg" />
<text>积分规则</text>
</view>
</view>
<view class='top-footer'>
<view class='top-footer-left' bindtap="toDetail">积分明细</view>
<view class='top-footer-counter' bindtap="toRMB">购买记录</view>
<view class='top-footer-right' bindtap='toExchangerecord'>积分兑换记录</view>
</view>
</view>
</view>
<view class="wave">
<image src="https://bhb.hvateng.com/public/static/images/wave.gif" mode="scaleToFill"></image>
</view>
</scroll-view>
page {
750rpx;
}
/* Start 顶部 */
/* Start 顶部的背景图片 */
.bg-wave {
position: fixed;
100%;
display: flex;
flex-direction: column;
}
.bg {
/* background-image: url(https://bhb.hvateng.com/public/static/baiheba/img/mall_bj.png); */
750rpx;
height: 420rpx;
position: fixed;
margin: 0 auto;
">#ebbb69;
/* background-size: 100% 100%; *//* -moz-background-size: 100% 100%; */
}
.wave {
100%;
}
.wave image {
height: 120rpx;
100%;
position: fixed;
top: 290rpx;
mix-blend-mode: screen;
}
/* End 顶部的背景图片 */
.top-right {
padding: 0 20rpx;
">#f3832a;
position: absolute;
top: 20rpx;
right: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
border-radius: 20rpx 0 0 20rpx;
}
.top-right image {
50rpx;
height: 50rpx;
}
.top-right text {
font-size: 26rpx;
color: #fff;
}
.top-container {
/* position: fixed; *//* top: 70rpx; */
710rpx;
margin: 0 auto;
}
.top-container text {
display: flex;
align-items: center;
justify-content: center;
font-size: 100rpx;
color: #fff;
}
.container-top {
display: flex;
align-items: center;
justify-content: center;
}
.container-top image {
30rpx;
height: 30rpx;
}
.container-top text {
font-size: 26rpx;
color: #fff;
margin-left: 10rpx;
}
.top-footer {
600rpx;
margin: 50rpx auto;
flex-direction: row;
display: flex;
align-items: center;
justify-content: center;
}
.top-footer-left, .top-footer-counter, .top-footer-right {
border: 1rpx #fff solid;
220rpx;
padding: 15rpx 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 22rpx;
color: #fff;
border-radius: 30rpx;
}
.top-footer-right, .top-footer-counter {
margin-left: 20rpx;
}
/* End 顶部 */