期望:地图可以拖动,下方区域可以滚动。
问题:模拟器没有问题,真机有问题
<template>
<scroll-view scroll-y :scroll-top="top" scroll-with-animation style="position: relative;width: 100%;height: 100vh;">
<map style="position: fixed;z-index: 0;width: 100%;height: 100vh;"></map>
<view class="panel" style="padding-top: 330px;pointer-events:none;">
<view style="pointer-events: auto;" >
<view @click="qwer(200)" style="height: 320rpx;background: #fff;border-radius: 16rpx; margin: 20rpx 0;pointer-events: auto;"></view>
<view class="title" style="bottom:176rpx;pointer-events: auto;">
这是标题
</view>
<view class="content qwe">
Touch.clientY:触点相对于可见视区(visual viewport)上边沿的Y坐标。不包括任何滚动偏移。只读属性。
Touch.pageX:触点相对于HTML文档左边沿的X坐标。当存在水平滚动的偏移时,这个值包含了水平滚动的偏移。
————————————————
</view>
<view class="title" style="bottom: 88rpx;pointer-events: auto;">
这是标题
</view>
<view class="title" style="bottom: 0;pointer-events: auto;">
这是标题
</view>
<view class="content qwe1">
Touch.clientY:触点相对于可见视区(visual viewport)上边沿的Y坐标。不包括任何滚动偏移。只读属性。
Touch.pageX:触点相对于HTML文档左边沿的X坐标。当存在水平滚动的偏移时,这个值包含了水平滚动的偏移。只读属性。
Touch.pageY:触点相对于HTML文档上边沿的Y坐标。当存在水平滚动的。
————————————————
</view>
</view>
</view>
</scroll-view>
</template>
<script>
let startY=0
export default {
data() {
return {
top:0,
}
},
onLoad() {
},
methods: {
}
}
</script>
<style>
page {
background: #efefef;
}
</style>
<style lang="scss" scoped>
.panel {
width: 100%;
padding: 0 30rpx;
box-sizing: border-box;
position: relative;
}
.title {
position: sticky;
background: #fff;
height: 88rpx;
padding: 0 20rpx;
line-height: 88rpx;
}
.content {
background: #efefef;
padding: 20rpx;
}
</style>
在h5中也没问题