The following is a dialog box (DIV) similar to QQ web page login. js + JSON is dynamically generated:
:
<HTML> <br/> <pead> <br/> <MCE: Script Type = "text/JavaScript"> <! -- <Br/> loginwindow = function (jsonobject) <br/>{< br/> This. width = jsonobject. width; <br/> This. height = jsonobject. height; <br/> This. titlecolor = jsonobject. titlecolor; <br/> This. backgroundcolor = jsonobject. backgroundcolor; <br/> This. lwheight = (document. body. clientheight-this. width)/2; // place the DIV in the middle of the screen <br/> This. lwwidth = (document. body. clientwidth-this. height)/2; // place the DIV in the middle of the screen <br/>}< br/> Lo Ginwindow. prototype = <br/>{< br/> createloginbody: function () // create a login box, that is, the entire box <br/>{< br/> var loginwindow = document. createelement ("Div"); <br/> with (loginwindow. style) <br/>{< br/> border = "1px solid black"; <br/> position = "absolute"; <br/> width = This. width + "PX"; <br/> Height = This. height + "PX"; <br/> Top = This. lwheight + "PX"; <br/> left = This. lwwidth + "PX"; <br/> backgroundcolor = This. backgr Oundcolor; </P> <p >}< br/> return loginwindow; <br/>}, <br/> createlogintitle: function () // create a black title <br/>{< br/> var Title = document. createelement ("Div"); <br/> var table = document. createelement ("table"); <br/> var tbody = document. createelement ("tbody"); <br/> var TR = document. createelement ("TR"); <br/> var td_1 = document. createelement ("TD"); <br/> var td_2 = document. createelement ("TD"); <br/> VaR Close = document. createelement ("A"); <br/> close. onclick = function () <br/>{< br/> document. body. removechild (title. parentnode); </P> <p >}< br/> close. innerhtml = "X"; <br/> td_1.innerhtml = "welcome"; <br/> with (title. style) <br/>{< br/> width = "100%"; <br/> Height = This. height/8 + "PX"; <br/> backgroundcolor = This. titlecolor; <br/>}< br/> with (table. style) <br/> {<br/> width = "100%"; <br/> backgroundcol OR = This. titlecolor; <br/> color = "white"; <br/>}< br/> td_2.style.textalign = "right"; <br/> td_2.appendchild (close ); <br/> tr. appendchild (td_1); <br/> tr. appendchild (td_2); <br/> tbody. appendchild (TR); <br/> table. appendchild (tbody); <br/> title. appendchild (table); <br/> return title; </P> <p >}, <br/> loadwindow: function () // combination window <br/>{< br/> var loginwindow = This. createloginbody (); <br/> var Title = thi S. createlogintitle (); <br/> loginwindow. appendchild (title); <br/> document. body. appendchild (loginwindow); </P> <p >}</P> <p> // --> </MCE: SCRIPT> <br/> </pead> <br/> <body> <br/> <MCE: Script Type = "text/JavaScript"> <! -- <Br/> var go = new loginwindow ({width: "300", height: "200", backgroundcolor: "white", titlecolor: "black "}); <br/> go. loadwindow (); </P> <p> // --> </MCE: SCRIPT> <br/> </body> <br/> </ptml>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
