@xunuo
2018-08-10T03:06:23.000000Z
字数 1336
阅读 866
前端
<!DOCTYPE HTML><html><head><meta charset="utf-8" /><link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"><script src="easyui/jquery.min.js" type="text/javascript"></script><script src="easyui/jquery.easyui.min.js" type="text/javascript"></script><style type="text/css"></style><script type="text/javascript">window.onload = function() {var onbtn = document.getElementById('btn');var onDelete = document.getElementById('delete');var onInfo = document.getElementById('info-box');var onCover = document.getElementById('background-cover');onbtn.onclick = function() {onInfo.style.display = 'block';onCover.style.display = 'block';onInfo.style.zIndex = 1;};onDelete.onclick=function(){onInfo.style.display='none';onCover.style.display='none';}$('#delete').linkbutton({iconCls: 'icon-no'});}</script></head><body><div><button id="btn">click me</button></div><div id="info-box" style="position:absolute; width:400px;height:400px;margin: 500px 500px;display: none;"><div id="box-header" style="width:400px;height:50px;background-color:#FFFFFF;text-align: center;">hello<a id="delete" style="float: right;"></a></div><div id="box-content">hi</div></div><div id="background-cover" style="position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: #000;opacity: 0.5;display: none;"></div></body></html>