小程序movable-area置于顶层遮盖下方元素无法操作的解决方案

48 阅读 0 评论 32 点赞

我是靠谱客的博主优美枫叶，最近开发中收集的这篇文章主要介绍小程序movable-area置于顶层遮盖下方元素无法操作的解决方案，觉得挺不错的，现在分享给大家，希望可以做个参考。

小程序项目中有个需求，右下角按钮可以在页面中随意拖动，此时查看文档找到了一个自带的标签可以实现此功能，代码如下

<movable-area>
<movable-view x="{{x}}" y="{{y}}" direction="all">text</movable-view>
</movable-area>

但是使用之后有个问题，

movable-area充满整个页面，置于所有元素顶层导致下方的所有元素无法操作，查询资料得知可以给这两个标签增加两个样式即可

movable-view {
pointer-events: auto;
}
movable-area {
pointer-events: none;
}

pointer-events: none;表示鼠标事件“穿透”该元素并且指定该元素“下面”的任何东西

pointer-events:auto;鼠标不会穿透当前层

转载于:https://www.cnblogs.com/bing0709/p/10636517.html

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。