<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>test1</title> <script> function show(){ var div=top.document.createElement("div"); var divText=document.createTextNode("Saving"); div.appendChild(divText); div.style.width=top.document.documentElement.scrollWidth+"px"; div.style.height=top.document.documentElement.scrollHeight+"px"; div.style.backgroundColor="gray"; div.style.position="absolute"; div.style.left=0; div.style.top=0; div.style.zIndex=9999; if(top.document.all) div.style.filter = "alpha(opacity=30)"; else div.style.opacity = .3; top.document.getElementById("ddd").appendChild(div); alert("真棒"); } </script> </head> <body> <div id="ddd"> <input type="button" value="click" onclick="show()" /> </div> </body> </html>
Version 2
@{ ViewBag.Title = "Index"; } @section Scripts{ <script type="text/javascript"> $(document).ready(function () { $("#btnShow").click(function () { // alert("show"); var div=document.createElement("div"); //div.style.width=top.document.documentElement.scrollWidth+"px"; //div.style.height=top.document.documentElement.scrollHeight+"px"; div.style.width="100px"; div.style.height="100px"; div.style.backgroundColor="gray"; div.style.position="absolute"; div.style.left = top.document.documentElement.scrollWidth/2 + "px"; div.style.top = document.getElementById("ddd").offsetHeight / 2 + "px"; div.style.zIndex=80; document.getElementById("ddd").appendChild(div); //********************************************************************* var Topdiv = document.createElement("div"); Topdiv.style.width = "700px"; Topdiv.style.height = "700px"; Topdiv.style.backgroundColor = "red"; Topdiv.style.position = "absolute"; Topdiv.style.left = 0; //Topdiv.style.top = document.getElementById("ddd").offsetHeight /2 + "px"; Topdiv.style.top = 0; Topdiv.style.zIndex = 70; if (top.document.all) Topdiv.style.filter = "alpha(opacity=30)"; else Topdiv.style.opacity = .3; document.getElementById("ddd").appendChild(Topdiv); alert("真棒"); }); }); </script> } <h2>Index</h2> <div id="ddd" style="z-index: 100;"> <input type="button" id="btnShow" value="click" /> <h1>hello1111</h1> <h1>hello1111</h1> <h1>hello1111</h1> <h1>hello1111</h1> <h1>hello1111</h1> <h1>hello1111</h1> </div>