1、首先，打开html编辑器，新建html文件，例如：index.html，输入问题基础代码。
2、在index.html中的<body>标签中，输入js代码：
function fun() {
alert('click success!')
}
3、浏览器运行index.html页面，此时点击按钮d出了提示框。
html中d出框可以用window.open方法
<html><head>
<script type="text/javascript">
function open_win()
{
window.open("需要d框的地址")
}
</script>
</head>
<body>
<input type=button value="Open Window" onclick="open_win()" />
</body>
</html>
定义和用法
open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。
<div class="mask-box"></div>
<div class="dialog-box">
d窗内容
</div>
通过fixed定位实现, ".mask-box" 模拟背景,".dialog-box"作为d窗容器，里面写d窗的内容。
通过控制样式，切换 display:block display: none实现点击出现、点击关闭d窗。
.mask-box{
/* 切换 display:block display: none*/
position: fixed
left: 0
right: 0
top: 0
bottom: 0
background:rgba(0,0,0,0.7)
z-index: 98
}
.dialog-box{
/* 切换 display:block display: none*/
position: fixed
left: 50%
top: 50%
transform: translate(-50%,-50%)
width: 300px
height: 200px
background: #fff
/* 按实际情况 设置z-index */
z-index: 98
}
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）