我很擅长 html 和 css,但不擅长 Javascript。
这是我的 HTML 编码:
<script>
var toggle = function() {
var mydiv = document.getElementById('nodate');
if (mydiv.style.display === 'block' || mydiv.style.display === '')
mydiv.style.display = 'none';
else
mydiv.style.display = 'block'
}
</script>
<div id="nodate" style="display:none"><span class="A"> <input type="image" src="http://www.weebly.com/uploads/1/6/7/6/16768236/custom_themes/307429121386408805/files/close-icon.png?1384992227202" width="42" onclick="toggle();" /></span><b>There are no reservations listed under the date you selected. </b>Please select another date or ask for assistance.<br><br><image src=”http://www.weebly.com/uploads/1/6/7/6/16768236/custom_themes/307429121386408805/files/sorry.jpg?1384992565622” width=”200”/></div>
此 CSS 代码随附:
#nodate {
background-color: #fff;
width: 95%;
height-min: 300px;
z-index: 500;
border: 2px solid #000;
padding: 10px;
margin-left: auto;
margin-right: auto;
position:absolute;
top: -10px;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
}
.A {
float: right;
margin-top: -30px;
margin-right: -30px;
}
启动 dIV 时,它会覆盖页面的一部分,但我希望它能使周围区域变暗。最简单的方法是什么,我该怎么做(如果使用 Javascript,请帮助我)
最佳答案
在我看来,您正在尝试构建模式弹出窗口。
你当然可以用 Javascript 自己构建它,但我的建议是调查一个库来为你做这件事。
jQuery 是一个不错的选择,jQuery UI 带有一个对话框,可以完全按照您的要求进行操作。它非常简单,而且作为 jQuery,您可以在线找到大量帮助。
关于javascript - float div 周围的暗区,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20110029/