Question

我创建了自定义模态窗口（没有插件）来阻止用户访问暂时与UI交互。这是代码：
我在文件中创建了一些html代码。

 <div id="modalWindow" style="display:none; visibility:hidden" class="black"> 
 </div>

以下是css设置：

black{                                                                       
    display: none;                                                          
    position: absolute;                                                                    top: 0%;
    left: 0%;                                                               
    width: 100%;                                                          
    height: 100%;                                                           
    background-color: black;                                                 
    z-index:1;                                                              
}

另外，我创建了一些js函数来动态调用它。

function modal(){                                                            
    showModalWindow();                                                       
    setTimeout(hideModalWindow, 2000);                                       
 }                                                                           

function showModalWindow() {                                                 
     document.getElementById("modalWindow").style.display = "block";         
     document.getElementById("modalWindow").style.visibility = "visible";    
 }                                                                           

function hideModalWindow() {                                                 
     document.getElementById("modalWindow").style.display = "none";          
     document.getElementById("modalWindow").style.visibility = "hidden";     
 }

但是当我调用modal（）时，黑屏（模态）很快就会消失。这是预期的我想，持续2秒钟请纠正我的错误并提供一个很好的替代方法。（没有插件，谢谢）

创建一个没有插件的自定义模态窗口

0 个答案: