Question

我有一个asp页面，我创建了一个函数，用于检测用户是否在Edge中。如果用户处于边缘并且单击了特定链接，则用户将获得一个弹出窗口，指出Edge不受支持。这工作正常，但出于某种原因，我的弹出窗口显示在IE 11窗口10页面的底部。这不会发生在所有机器上，而是一些。我的模态Div是我的asp页面中的最后一个代码。我不确定这是否可能是代码中的错误或IE在这些机器中的设置方式，但不应该将div隐藏在默认值之外。任何反馈都非常令人满意。

        /* The Modal (background) */
.modal {
	display: none; /* Hidden by default */
	position: fixed; /* Stay in place */
	z-index: 1; /* Sit on top */
	left: 0;
	top: 0;
	width: 100%; /* Full width */
	height: 100%; /* Full height */
	overflow: auto; /* Enable scroll if needed */
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
	-webkit-animation-name: fadeIn; /* Fade in the background */
	-webkit-animation-duration: 0.4s;
	animation-name: fadeIn;
	animation-duration: 0.4s
}

/* Modal Content */
.modal-content {
	position: fixed;
	width: 320px;
	height: 250px;
	left: 50%;
	top: 50%; 
	margin-left: -150px;
	margin-top: -160px;
	background-color: #fefefe;
}

/* The Close Button */
.close {
	color: white;
	float: right;
	font-size: 28px;
	font-weight: bold;
}

.close:hover,
.close:focus {
	color: red;
	text-decoration: none;
	cursor: pointer;
}

.modal-header {
	padding: 2px 10px;
	height: 30px;
	background-color: #000;
	color: white;
}

.modal-body {
	padding: 2px 10px;
	height: 120px;
}

.modal-footer {
	padding: 2px 10px;
	height: 0px;
	background-color: #000;
	color: white;
}

/* Add Animation */
@-webkit-keyframes slideIn {
	from {bottom: -300px; opacity: 0}
	to {bottom: 0; opacity: 1}
}

@keyframes slideIn {
	from {bottom: -300px; opacity: 0}
	to {bottom: 0; opacity: 1}
}

@-webkit-keyframes fadeIn {
	from {opacity: 0}
	to {opacity: 1}
}

@keyframes fadeIn {
	from {opacity: 0}
	to {opacity: 1}
}

   <% IF varIsEdge = 1 Then %>
    					<a title="Login" name="#top" href="#" onclick="document.getElementById('myModal').style.display = 'block';" >&#187; Login</a>
    				<% Else %>
    					<a title="Login" name="#top" target="_blank" href="https://yahoo.com">&#187; Login</a>
    				<% End If %>

   

      <div class="modal-content" style="border-style: solid; border-width: 1px; padding: 10px;" >
    <span class="close" style="color:#000" title="Close" onclick="document.getElementById('myModal').style.display = 'none';" >&times</span>
    <div class="modal-body" align="center"  >
    <h3>browser is not supported</h3>
    <p>To use this, please use Internet Explorer</p>
    <img src="logo.png" width=100 height=105 />
    </div>
      </div>
    </div> 
</body>
</html>

Answer 1

具有模态类的div在哪里？你只提供了一个带有模态内容和模态体的div。

<div class="modal">

你可能在你的模态中淡化了类，这对IE不起作用

显示没有出现在IE win 10中

1 个答案: