iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >如何解决layer弹层遮罩挡住窗体的问题
  • 282
分享到

如何解决layer弹层遮罩挡住窗体的问题

2024-04-02 19:04:59 282人浏览 安东尼
摘要

这篇文章主要介绍如何解决layer弹层遮罩挡住窗体的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!使用代码:<div>    <d

这篇文章主要介绍如何解决layer弹层遮罩挡住窗体的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

使用代码:

<div>
   <div>这里面某个按钮触发弹层<div>
   <div id='dialog' hidden='hidden'></div>
</div>

如果上面的按钮触发了弹层 layer.open 且content是某个DOM元素

content:$('#dialog')

那么这里弹出层,遮罩会遮住到弹窗导致操作不了。

官网给出的说法是 如果弹层的内容content是某个DOM元素的话,要放在body的根节点下。不能放在div里面了。

我看了html代码,最后生成的遮罩DOM元素的位置是body的子级,所以知道弹层的DOM要和遮罩的DOM 要在同一层。

所以这里再弹层的success的事件里面进行了处理,将遮罩的DOM位置挪动了一下,和弹层DOM元素同一级,代码如下:

success:function(layero){
   var mask = $(".layui-layer-shade");
   mask.appenTo(layero.parent());
   //其中:layero是弹层的DOM对象
}

这样 弹层的遮罩DOM元素和弹层元素就在同一层了,就不会挡着弹层了。

以上是“如何解决layer弹层遮罩挡住窗体的问题”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注编程网node.js频道!

--结束END--

本文标题: 如何解决layer弹层遮罩挡住窗体的问题

本文链接: https://www.lsjlt.com/news/74493.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 如何解决layer弹层遮罩挡住窗体的问题
    这篇文章主要介绍如何解决layer弹层遮罩挡住窗体的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!使用代码:<div>    <d...
    99+
    2024-04-02
  • 如何解决layui弹出层layer中area过大被遮挡的问题
    小编给大家分享一下如何解决layui弹出层layer中area过大被遮挡的问题,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!la...
    99+
    2024-04-02
  • 如何解决Vue开发中对话框被遮罩层挡住的问题
    这篇文章将为大家详细讲解有关如何解决Vue开发中对话框被遮罩层挡住的问题,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。在Vue的开发中,一旦我们用到对话框,经常出现的问题...
    99+
    2024-04-02
  • 解决vue多层弹框时存在遮挡问题
    目录问题: 解决方案:正确思路: 问题:  如上图所示,当存在多层弹框时,点击黄色弹框中红色内容,弹出蓝色弹框时,出现上述情况,即表现出顶层弹框被遮挡的现象,当我们点击蓝色弹框时又会...
    99+
    2024-04-02
  • 如何解决移动端悬浮层遮挡住内容
    本篇内容介绍了“如何解决移动端悬浮层遮挡住内容”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!在现在的前端页...
    99+
    2024-04-02
  • CSS如何实现带遮罩层可关闭的弹窗效果
    这篇文章给大家分享的是有关CSS如何实现带遮罩层可关闭的弹窗效果的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。实际开发中常常少不了使用弹窗,在学习css3的时候我发现可以通过纯css实现带遮罩层可关闭的弹窗。使用...
    99+
    2023-06-08
  • React-Native如何解决键盘遮挡问题
    这篇文章主要介绍了React-Native如何解决键盘遮挡问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。在开发中经常遇到需要输入的地方,...
    99+
    2024-04-02
  • CSS3如何为背景图设置遮罩并解决遮罩样式继承问题
    这篇文章主要介绍了CSS3如何为背景图设置遮罩并解决遮罩样式继承问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。工作中很多时候需要对图片背景作处理,比如设置通透性,模糊处理...
    99+
    2023-06-08
  • 如何解决layer弹出层自适应页面大小的问题
    这篇文章主要介绍了如何解决layer弹出层自适应页面大小的问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。网上的解决方案大都是以下几种:1...
    99+
    2024-04-02
  • Android如何解决虚拟按键栏遮挡问题
    最近在公司的项目中 , 华为用户反馈出了一个问题 , 华为手机底部有虚拟按键栏把应用的底部内容遮挡住了 , 现在已经把这个问题解决了 , 记录一下,给各位遇到相同问题的童鞋做一下参考...
    99+
    2024-04-02
  • 如何解决css中hover做遮盖罩闪动的问题
    这篇文章主要介绍如何解决css中hover做遮盖罩闪动的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!具体代码如下所示:<div id="div2&qu...
    99+
    2024-04-02
  • 如何解决layer关闭弹出窗口触发表单提交的问题
    这篇文章主要介绍如何解决layer关闭弹出窗口触发表单提交的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!1、前言 表单的代码:<form>  此处理代码...
    99+
    2024-04-02
  • vue如何解决文本框被键盘遮住的问题
    小编给大家分享一下vue如何解决文本框被键盘遮住的问题,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!如下所示:我把它写成了组件主...
    99+
    2024-04-02
  • css中如何解决绝对定位元素被遮挡的问题
    这篇文章主要介绍css中如何解决绝对定位元素被遮挡的问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!具体方法如下:ie7下绝对定位元素即使z-index值很高,如果其设置相对定位的...
    99+
    2024-04-02
  • 如何解决layui弹窗按enter键不停弹窗的问题
    这篇文章主要为大家展示了“如何解决layui弹窗按enter键不停弹窗的问题”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“如何解决layui弹窗按enter键不...
    99+
    2024-04-02
  • CSS DIV弹出层问题如何解决
    这篇文章主要讲解了“CSS DIV弹出层问题如何解决”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS DIV弹出层问题如何解决”吧!DIV弹出层问题解决方案一、关于如何让png背景在IE...
    99+
    2023-07-04
  • 如何解决layer弹出层msg的文字不显示
    这篇文章主要介绍了如何解决layer弹出层msg的文字不显示,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。今天在做项目的时候,做了一个弹出层...
    99+
    2024-04-02
  • 如何解决DIV层被Flash或表单遮盖问题
    本篇文章给大家分享的是有关如何解决DIV层被Flash或表单遮盖问题,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。在网页制作中,如果遇到DIV...
    99+
    2024-04-02
  • 如何解决VB.NET窗体继承问题
    这篇文章主要介绍如何解决VB.NET窗体继承问题,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!创建一个基窗体Form1,在窗体中放入三个TextBox,为别为TextBox1 TextBox2 TextBox3为Te...
    99+
    2023-06-17
  • 如何解决Pytorch中Batch Normalization layer的问题
    小编给大家分享一下如何解决Pytorch中Batch Normalization layer的问题,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!1. 注意mome...
    99+
    2023-06-15
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作