Bootstrap V4模式效果背景不稳定
问题描述:
enter image description here模式打开与窗体URL栏。当用户点击一个栏时,Modal会打开URL栏和网站名称。现在问题是当模式打开并且用户将光标移动到打开栏的区域时,背景栏会变成白色或打扰。Bootstrap V4模式效果背景不稳定
引导代码,我试图
<div class="container-fluid">
<!-- Form trigger modal -->
<form action="testiing bars.php" method="get" data-toggle="modal" data-target="#formModal">
<div class="form-group">
<label for="inputlg"></label>
<input class="form-control input-lg" id="inputlg" type="text" name="website">
</div>
</form>
<!-- Modal -->
<div class="modal fade" id="formModal" tabindex="-1" role="dialog" aria-labelledby="formModal" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Submit URL</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
不知道如何解决这个问题?
答
我用添加背景滚动到弹出的可用性功能的代码,可能会有所帮助:
/*allow modal scroll behind*/
html { overflow-y: scroll !important; }
body .modal-open { overflow: visible; }
号。同样的问题。 其实,事情是我在不同的论坛问同样的问题,并最终这是我的浏览器问题。现在我使用的是Chrome,问题在于这只发生在Chrome中。我仍然不知道为什么。 –
Chrome通常是最宽容的浏览器..可能有一些冲突的样式或焦点抓取脚本,尝试通过移除事物来简化。 – numbtongue