Skip to content

Instantly share code, notes, and snippets.

@harry1064
Created January 19, 2017 08:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save harry1064/00d6db8393fb41ac5a83cc83175211d8 to your computer and use it in GitHub Desktop.
Save harry1064/00d6db8393fb41ac5a83cc83175211d8 to your computer and use it in GitHub Desktop.
<html>
<head>
<META HTTP-EQUIV="EXPIRES" CONTENT="-1" />
<script type="text/javascript">
function showFrontLayer() {
document.getElementById('bg_mask').style.visibility='visible';
document.getElementById('frontlayer').style.visibility='visible';
}
function hideFrontLayer() {
document.getElementById('bg_mask').style.visibility='hidden';
document.getElementById('frontlayer').style.visibility='hidden';
}
</script>
<style type="text/css">
#bg_mask {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
margin-top: 0px;
background-color: black;
opacity: 0.8;
z-index: 0;
visibility: hidden;
}
#frontlayer {
position: absolute;
top: 50;
right: 50;
bottom: 50;
left: 50;
background-color: orange;
visibility: hidden;
border: 1px solid black;
z-index: 1;
}
</style>
</head>
<body>
<form action="http://bytes.com/test.html">
<div id="baselayer">
Product -one
company - two
<input type="button" value="Show front layer" onclick="showFrontLayer();"/> Register<br/><br/>
<div id="bg_mask">
<div id="frontlayer"><br/><br/>
<form>
Id<input type="text" name="id"><br/>
<input type="submit" value="ok"><br/>
</form>
<input type="button" value="Hide front layer" onclick="hideFrontLayer();"/>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment