JS Implementation div Simulation modal dialog box to show URL content _javascript skills

This article describes the JS implementation of the DIV Simulation modal dialog box to show the URL content. Share to everyone for your reference, specific as follows:

<script> function Salert (str) {var msgw,msgh,bordercolor; msgw=800;//the width of the prompt window msgh=600;//the height of the prompt window titleheight=25//Hint window caption height bordercolor= "#336699";/Hint window border color titlecolor= "#
 99CCFF ";//Hint window title color var swidth,sheight;
 Swidth=document.body.offsetwidth;
 Sheight=screen.height;
 var bgobj=document.createelement ("div");
 Bgobj.setattribute (' id ', ' bgdiv ');
 bgobj.style.position= "Absolute";
 bgobj.style.top= "0";
 Bgobj.style.background= "#777";
 Bgobj.style.filter= "Progid:DXImageTransform.Microsoft.Alpha" (style=3,opacity=25,finishopacity=75);
 bgobj.style.opacity= "0.6";
 bgobj.style.left= "0";
 Bgobj.style.width=swidth + "px";
 Bgobj.style.height=sheight + "px";
 BgObj.style.zIndex = "10000";
 Document.body.appendChild (Bgobj);
 var msgobj=document.createelement ("div") Msgobj.setattribute ("id", "msgdiv");
 Msgobj.setattribute ("Align", "center");
 msgobj.style.background= "White";
  Msgobj.style.border= "1px solid" + bordercolor;
 MsgObj.style.position = "absolute"; MsgObj.style.left = "60%";
   MsgObj.style.top = "20%";
   Msgobj.style.font= "12px/1.6em Verdana, Geneva, Arial, Helvetica, Sans-serif";
   MsgObj.style.marginLeft = " -525px";
   MsgObj.style.marginTop = -75+document.documentelement.scrolltop+ "px";
   MsgObj.style.width = MSGW + "px";
   MsgObj.style.height =msgh + "px";
   msgObj.style.textAlign = "center";
   MsgObj.style.lineHeight = "25px";
  MsgObj.style.zIndex = "10001";
  var title=document.createelement ("H4");
  Title.setattribute ("id", "msgtitle");
  Title.setattribute ("Align", "right");
  title.style.margin= "0";
  Title.style.padding= "3px";
  Title.style.background=bordercolor; Title.style.filter= "Progid:DXImageTransform.Microsoft.Alpha (startx=20, starty=20, finishx=100, finishy=100,style=
  1,OPACITY=75,FINISHOPACITY=100); ";
  Title.style.opacity= "0.75";
  Title.style.border= "1px solid" + bordercolor;
  Title.style.height= "18px";
  Title.style.font= "12px Verdana, Geneva, Arial, Helvetica, Sans-serif";
  title.style.color= "White"; Title.style.cursor="Pointer";
  Title.innerhtml= "Close";
   Title.onclick=function () {document.body.removeChild (bgobj);
   document.getElementById ("Msgdiv"). RemoveChild (title);
   Document.body.removeChild (Msgobj);
  } document.body.appendChild (Msgobj);
  document.getElementById ("Msgdiv"). AppendChild (title);
  var txt=document.createelement ("P");
  Txt.style.margin= "1em 0" Txt.setattribute ("id", "msgtxt");
  TXT.INNERHTML=STR;
  document.getElementById ("Msgdiv"). appendchild (TXT);
 function Ajax_form (URL) {$.post (URL, {Action: "POST"}, function (data) {Salert (data);
}, "html");

 } </script>

Usage:

Copy Code code as follows:

<a href= ' # ' onclick= ' ajax_form (' http://localhost/create_user_form.html '); >test</a>

PS: Code layout seems not very satisfactory, here Small series to recommend several code formatting tools, I believe that in the future programming can be used to develop:

C Language Style/html/css/json code formatting landscaping Tools:
Http://tools.jb51.net/code/ccode_html_css_json

Online JavaScript code Landscaping, formatting tools:
Http://tools.jb51.net/code/js

JavaScript code Landscaping/compression/formatting/encryption Tools:
http://tools.jb51.net/code/jscompress

Online JSON code inspection, inspection, landscaping, formatting tools:
Http://tools.jb51.net/code/json

JSON code online Format/beautify/compress/edit/Convert tools:
Http://tools.jb51.net/code/jsoncodeformat

More about JavaScript content to view the site topics: "JavaScript Ajax Operating Skills Summary", "javascript json operation tips Summary", "JavaScript switching effects and techniques summary", " JavaScript Search Algorithm Skills Summary, "JavaScript animation effects and techniques Summary", "JavaScript Error and debugging skills Summary", "JavaScript data structure and algorithm skills summary", "JavaScript traversal algorithm and skills summary" and The summary of JavaScript mathematical operational usage

I hope this article will help you with JavaScript programming.