预期是想在canvas上做一个关闭的小叉,在右上角;
当我用第一种方式写的时候,所有ios出现了定位偏差的问题,安卓没有
一、wxml:
<view class='canvasCon' style="width:670rpx;height:850rpx" catchtap='closecanvas2'>
<canvas canvas-id="myCanvas" class="canvas">
<cover-view bindtap='closecanvas' class="canvasView">
<cover-image class="canvasImg" src="https://cms.hylpz.cn/data/images/common/close.png"/>
</cover-view>
</canvas>
<view class="canvasButton" catchtap='canvasToTempFilePath'>保存图片</view>
</view>
..
wxss:
.page .canvasBox .canvasCon{
top: 50%;
left: 50%;
margin-left: -335rpx;
margin-top: -500rpx;
position: relative;
border-radius: 20rpx;
z-index: 999;
background: #fff;
}
.page .canvasBox .canvasCon .canvasView{
display: block;
width: 44rpx;
height: 44rpx;
position: absolute;
top:20rpx;
right: 20rpx;
z-index: 1000;
}
安卓展示:
ios展示:
于是我想个办法解决这个问题,就是把 <cover-view>拿出来,不放在canvas标签里;
二、wxml:
<view class='canvasCon' style="width:670rpx;height:850rpx" catchtap='closecanvas2'>
<canvas canvas-id="myCanvas" class="canvas">
</canvas>
<view class="canvasButton" catchtap='canvasToTempFilePath'>保存图片</view>
<cover-view bindtap='closecanvas' class="canvasView">
<cover-image class="canvasImg" src="https://cms.hylpz.cn/data/images/common/close.png"/>
</cover-view>
</view>
..
wxss不变
结果是一部分ios可以正常显示,而iP6s以及plus上cover-view没有canvas层级高,被压在下面导致不显示,其中白色部分是canvas!
所以请问有什么办法解决?