我已经为我的网站创建了一个弹出窗口,但我想为移动设备隐藏它。我做了如下隐藏它
.modal-content{
width: 440px;
margin-left: 40px;
margin-top: -15px;
}
.modal-header{
height: 5px;
}
.peep{
margin-top: -6px;
}
@media screen and (max-width: 600px) {
.money{
display: none;
}
}
当我这样做时它没有显示,但问题是浅色阴影如下图所示并且屏幕没有移动,没有滚动。
<script type="text/javascript">
$(document).ready(function(){
$("#myModal").modal('show');
});
</script>
<div class="money">
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<div class="peep"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
</div>
<div class="modal-body">
<img style="margin-left:-7.5px; margin-top:-10px;" src="assets\images\popup.jpg" alt="offer">
</div>
</div>
</div>
</div>
</div>
这是弹出窗口的完整代码。谁能告诉我它有什么问题吗?
最佳答案
在您的脚本中使用以下代码。 600以下分辨率不会弹窗
$(window).on('load resize', function() {
if ($(window).width() > 600){
$("#myModal").modal('show');
}
});
关于javascript - 无法在移动 View 中隐藏 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55724499/