在模式上方显示弹出窗口
在模式上方显示弹出窗口
提问于 2019-04-19 17:37:40
我想在我的用例中显示一个模式弹出窗口。我无法隐藏或显示任何弹出式窗口或任何其他div的modal.The顶部和左边的位置没有为弹出式窗口设置。我尝试过z-index，但它不起作用。
CSS：
<button id="button1">click</button>
<div class="modal" id="abc">
<div class="content">
<h1>Hi</h1>
<div id="popupabc" hidden="hidden">
<h1>Hello</h1>
</div>
</div>
</div>JQuery：
$(function(){
$("#button1).on('click',function(e){
$("#abc").modal('show');
});
$(document).on('click',function(e){
// getting mouse click positions left(x) and top(y).
$("#popupabc").css({position:'absolute',left:x,top:y});
$("#popupabc").show();
});
}回答 1
Stack Overflow用户
发布于 2019-04-19 17:48:40
<script type="text/javascript">
function ShowPopup(title, body) {
$("#MyPopup .modal-title").html(title);
$("#MyPopup .modal-body").html(body);
$("#MyPopup").modal("show");
}
</script>
<style>
blink {
animation: blinker 0.6s linear infinite;
color: #1c87c9;
}
@keyframes blinker {
50% { opacity: 0; }
}
.blink-one {
animation: blinker-one 1s linear infinite;
}
@keyframes blinker-one {
0% { opacity: 0; }
}
.blink-two {
animation: blinker-two 1.4s linear infinite;
}
@keyframes blinker-two {
100% { opacity: 0; }
}
</style>
<div id="MyPopup" class="modal fade" role="dialog" style="margin-top: 236px;margin-left: 245px;width:500px">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×</button>
<h4 class="modal-title">
<%--<img src="../../Images/banner.jpg" class=" img-responsive" style="width: 100%; height:450px">--%>
<blink>Here you can type any message which you want..!!</blink>
</h4>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">
Close</button>
</div>
</div>
</div>
</div>--这是在弹出代码中添加的- ClientScript.RegisterStartupScript(this.GetType()，“aspx.cs”，"ShowPopup();"，true)；
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55759738
复制相关文章
相似问题
腾讯云开发者
