作者:不奸不散遇 | 来源:互联网 | 2023-05-19 03:51
wxml代码:
第一种方案
11111
22
33
44
5555
666
wxss代码:
page{height:100%}
.note{ padding:10px; background:#f36; border-bottom:1px solid #ddd; color: #fff;}
.block {
border: 8px solid #71b471;
margin: 20rpx 20rpx;
padding: 10rpx;
background-color: #fff;
border-radius: 20rpx;
text-align: center;
height:700rpx;
}
.top {
width: 100rpx;
height: 100rpx;
line-height: 100rpx;
/* background-color: #ddd; */
position: fixed;
bottom: 40rpx;
right: 20rpx;
text-align: center;
font-size: 50rpx;
opacity: .8;
border-radius: 50%;
border: 1px solid #fff;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAEZUlEQVR4Xu1biVEVQRDtjUCIQI1AiACJQIgAicA2AiEC2wiECCQDIQI/ESgRqBGM9bZmcHb/zt+5eg90qrYK6u8c701PX9PbkHJj5r2maY6MMQdEhGePiF7Yx5/9BxHh+UVEm6ZpNsaYOxHB/2qt0RiZmQH0jIheW9Al02yI6JaIrkUEf1dt1QiwO31mjHlbAXQIJCTjyhgDMqpIRjEBAE5E74iIrXhX3aHAYAAvRPSplIgiApj5hIg+Twi8zweIOBeRm1zWswhgZigxAMcZX0KDjgARUKJJLZmABex6CGCWNCQRwMwf7VlPYnnily9E5DJ2zmgCmBkiDw2/hnYlIucxC40iYGXgHe4oEkYJWCn4aBJ2EsDMsLWw8WtulyJyEQIQJMBq+y9rRu6t/TTkKwwSYO38txkdnNq8w0QeDvkJIQK+LsjJqUXGrYgc9wfbIuCJiX4f79ZR6BBgA5vvT0j0h2KHl34A1ScA2vJDLZlb6Dgdq/BIQKXdf7BZHU3sCMSeF0wAhfgoBT4BiOfh6+e2nfY2d9ChfsxcKqnvRQQ+DvkEwOwhlZXVRGTUq8waONCJmU3BeBsROXwkwObwQEBJg1glx+M5E1o/Bcq6pMEv2LS7VsnlRb4OolklV7cD2Z4xBvNkS6sdG+k0dgQUiX/JNszYtz0GjdX+P2dcyJxT74MAJDbnCHrurbvtEqtzEHEKAkpNSs7CW/DOI7NKGInNZzmDFfS5BAFIKb8pGCS1awe86zwTCdcgAMwfpaLIfH8Q/Iwk3IEA2FO4l9rtGhZ37CbH2nhI5SvtBbWXsIUeVewacZcXnVG2lgmSqU7CFAQkgfeOA+4c1UnQJiALfI8EHAc1HaVJQBF4/2wx85WtN4g9ctHvgQAEMCXx9dBk1cB70qBBwoOGGawOXpGE1gzWdoQQDUKB+S3qmqon9nCR+1YA4yJxU6u1jtAkrnBqwmQi89y6wpMEQwsloA2GIFbq4fBCCdh3CRGUn6l6XQsk4F5EDmqmxHYqpgUS0EmJIb9WmhRdGwF/k6JYOTOrHoOFSUAr/sBd82JkzDbvj4XCvRhAUzGjpA6eZYcAWAO4xVppqbYIeowl+7srqo58Pem138h/uM34fznacz+1pSBpqxRexuXtQfB63CrDSTxDBXAxQ+4ukPCU0JSJ0piF13gHH19s1TbvKpKCwtJSiDUApYzRUXx+x3+lTO5YRCDVW22sUHKSUDllKzPezSuU9PSBRioqA0dWl9HsVFRVh2ZSMgtWXKdR8B1PcGzMlZEQBT6JAOsjrKF4OqlYK+oI9LxFOErQC0szkTB1JyFtH5LwZAKsJOAyFSSo3diMHcne73cWfHJ9UhYBnoWYWxrg2+PGedrP5npHwuXqka+f6lhA3KGPUO+YvOtRnmCiCCKjBCJwBY5HK8GKAgsAvykF7vAVHYEQSbbcBUQg+CglA6DhxuJ2KTahEr1/KgQMHBH3Fbn7bH6o4NkVWrvP6NuvxmvtdIiRP3RowHtt7Hx7AAAAAElFTkSuQmCC) no-repeat; background-size: 100%
}
js代码:
Page({
data: {
scrollTop: 0,//滚动初始值
hidden: true//隐藏
},
scrll: function (e) {
console.log(e.detail);
var scrollTop = e.detail.scrollTop
console.log(scrollTop)
if (scrollTop > 100) {
this.setData({
hidden: false
})
console.log(this.data.scrollTop)
} else {
this.setData({
hidden: true
});
}
},
//返回到顶部
goTop: function (e) {
this.setData({
scrollTop: 0,
hidden: true
})
}
})