modal在asp.net中使用jquery弹出 [英] modal pop up using jquery in asp.net

问题描述

我有一个要求，我需要使用jQuery实现模式弹出。主要条件是我不应该使用jQuery UI。相反，我需要使用CSS和简单的jQuery创建它。任何人都可以帮我解决这个问题。

I got a requirement where I need to implement modal pop up using jQuery. Ghe main condition is that I should not use jQuery UI. Instead I need to create it using CSS and simple jQuery. Can any one help me to resolve the issue.

推荐答案

这是解决方案

Here is the solution

.modal-backdrop {
           background-color: rgba(0, 0, 0, 0.61);
           position: absolute;
           top: 0;
           bottom: 0;
           left: 0;
           right: 0;
           display: none;
       }
       .modal {
           width: 500px;
           position: absolute;
           top: 25%;
           z-index: 1020;
           background-color: #FFF;
           border-radius: 6px;
           display: none;
       }
       .modal-header {
           background-color: #333;
           color: #FFF;
           border-top-right-radius: 5px;
           border-top-left-radius: 5px;
       }
       .modal-header h3 {
           margin: 0;
           padding: 0 10px 0 10px;
           line-height: 40px;
       }
       .modal-header h3 .close-modal {
           float: right;
           text-decoration: none;
           color: #FFF;
       }
       .modal-footer {
           background-color: #F1F1F1;
           padding: 0 10px 0 10px;
           line-height: 40px;
           text-align: right;
           border-bottom-right-radius: 5px;
           border-bottom-left-radius: 5px;
           border-top: solid 1px #CCC;
       }
       .modal-body {
           padding: 0 10px 0 10px;
       }

（ function （）{
modalPosition（）;

(function () { modalPosition();

（ window ）。resize（ function （）{
modalPosition（）;
}）;

(window).resize(function () { modalPosition(); });

这篇关于modal在asp.net中使用jquery弹出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！