JS CSS Article view system _javascript Tips

Source: Internet
Author: User
Tags visibility
Make a connection: Click to execute JavaScript function;
Function:windowstextshow (Id div.id);
Div.id is the ID of the div to display the text;
The code is as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <title>untitled page</title> < Style type= "Text/css" > #divback {width:100%; Height:expression (Body.scrollheight); Background-color: #000; Position:absolute; top:0; left:0; z-index:49; Display:none; filter:progid:dximagetransform.microsoft.alphaopacity=25; Filter:alpha (opacity=55); } . windowstextshow {top:expression (documentelement.scrolltop + 50); left:50px; Height:expression (documentelement.clientheight-50*2); Width:expression (body.clientwidth-50*2); Position:absolute; z-index:50; Color:black; BORDER:3PX solid #E5E5E5; Background-color: #F0F0F0; } . Windowstextshowfull {top:expression (documentelement.scrolltop); left:0px; height:100%; width:100%; Position:absolute; z-index:50; BORDER:3PX solid #E5E5E5; background-Color: #F0F0F0; } #textContent {padding:5px; height:80%; Overflow:auto; Line-height:normal; font-size:14px; Color:black; Background-color:white; } #ctrlSet {font-size:12px; }. ctrlsetstate {display:block; } </style> <script charset= "GB2312" language= "JavaScript" type= "Text/javascript" > var ocolorpopup = window. Createpopup (); var ecolorpopup = null; var isfullscreen = false; var isrunning = false; var isctrlsetshow = true; var div_box = document.createelement ("div"); var div_back = document.createelement ("div"); var textwindowtop = m + document.documentElement.scrollTop; var textwindowleft = 50; function Colordialogmouseout (obj) {obj.style.borderColor = ""; Obj.bgcolor = ""; function Colordialogmouseover (obj) {obj.style.borderColor = ' #0A66EE '; Obj.bgcolor = "#EEEEEE"; function Colordialogmousedown (color) {ecolorpopup.value = color; if (Getradiovalue ("colortype") = = "TextColor") {textContent.style.color = color; else if (Getradiovalue ("colortype") = = "Textbackcolor") {textContent.style.backgroundColor = color; else {divback.style.backgroundColor = color; } ocolorPopup.document.body.blur (); The function Colorset () {if (Window.event.keyCode = =) {if (IsColor ()) {Ecolorpopup.value = document.getElementById ("Setcolorbox"). Value; if (Getradiovalue ("colortype") = = "TextColor") {textContent.style.color = Ecolorpopup.value; else if (Getradiovalue ("colortype") = = "Textbackcolor") {textContent.style.backgroundColor = Ecolorpopup.value; else {divback.style.backgroundColor = Ecolorpopup.value; } ocolorPopup.document.body.blur (); The function IsColor () {var pattern =/^#[0-9a-fa-f]{6}$/var ObjValue = document.getElementById ("Setcolorbox"). Value ; if (Objvalue.match (pattern)!= null) {return true; else {return false; } function Colordialogmore () {var scolor = Dlghelper.choosecolordlg (Ecolorpopup.value); Scolor = scolor.tostring (16); if (ScoloR.length < 6) {var stempstring = "000000". Substring (0, 6-scolor.length); Scolor = Stempstring.concat (Scolor); } ecolorpopup.value = "#" + scolor.touppercase (); Document.body.bgcolor= "#" +scolor.touppercase (); OcolorPopup.document.body.blur (); function ColorDialog () {var e = event.srcelement; E.onkeyup = ColorDialog; Ecolorpopup = e; var ocbody; var opopbody = ocolorPopup.document.body; var colorlist = new Array (40); var COLORDIALOGW = 158; var Colordialogh = 147 var COLORDIALOGX = e.offsetleft + textwindowleft-7; var colordialogy = e.offsettop + textwindowtop-colordialogh-10; OPopBody.style.backgroundColor = "#f9f8f7"; OPopBody.style.border = "Solid #999999 1px"; OPopBody.style.fontSize = "12px"; Colorlist[0] = "#000000"; COLORLIST[1] = "#993300"; COLORLIST[2] = "#333300"; COLORLIST[3] = "#003300"; COLORLIST[4] = "#003366"; COLORLIST[5] = "#000080"; COLORLIST[6] = "#333399"; COLORLIST[7] = "#333333"; COLORLIST[8] = "#800000"; COLORLIST[9] = "#FF6600 "; COLORLIST[10] = "#808000"; COLORLIST[11] = "#008000"; COLORLIST[12] = "#008080"; COLORLIST[13] = "#0000FF"; COLORLIST[14] = "#666699"; COLORLIST[15] = "#808080"; COLORLIST[16] = "#FF0000"; COLORLIST[17] = "#FF9900"; COLORLIST[18] = "#99CC00"; COLORLIST[19] = "#339966"; COLORLIST[20] = "#33CCCC"; COLORLIST[21] = "#3366FF"; COLORLIST[22] = "#800080"; COLORLIST[23] = "#999999"; COLORLIST[24] = "#FF00FF"; COLORLIST[25] = "#FFCC00"; COLORLIST[26] = "#FFFF00"; COLORLIST[27] = "#00FF00"; COLORLIST[28] = "#00FFFF"; COLORLIST[29] = "#00CCFF"; COLORLIST[30] = "#993366"; COLORLIST[31] = "#CCCCCC"; COLORLIST[32] = "#FF99CC"; COLORLIST[33] = "#FFCC99"; COLORLIST[34] = "#FFFF99"; COLORLIST[35] = "#CCFFCC"; COLORLIST[36] = "#CCFFFF"; COLORLIST[37] = "#99CCFF"; COLORLIST[38] = "#CC99FF"; COLORLIST[39] = "#FFFFFF"; Ocbody = ""; Ocbody + = "<table cellpadding=0 cellspacing=3>"; Ocbody + = "<tr height=\" 20\ "width=\" 20\ "><td align=\" Center\ "><table style=\" border:1pxLid #808080; \ "Width=\" 12\ "height=\" 12\ "bgcolor=\" "+ E.value +" \ "><tr><td></td></tr> &LT;/TABLE&GT;&LT;/TD&GT;&LT;TD bgcolor=\ "eeeeee\" colspan=\ "7\" style=\ "font-size:12px;\" align=\ "Center\" > Current color </td></tr> "; for (var i = 0; i < colorlist.length i++) {if (i% 8 = 0) Ocbody + = "<tr>"; Ocbody + = "<td width=\" 14\ "height=\" 16\ "style=\" border:1px solid;\ "onmouseout=\" Parent.colordialogmouseout (this ); \ "Onmouseover=\" parent.colordialogmouseover (this); \ onmousedown=\ Parent.colordialogmousedown (' "+ colorlist[i ] + "') \" align=\ "Center\" valign=\ "middle\" ><table style=\ "border:1px solid #808080; \" Width=\ "12\" height=\ "12\ "Bgcolor=\" "+ colorlist[i] +" ><tr><td></td></tr></table></td> "; if (i% 8 = 7) Ocbody + = "</tr>"; }//ocbody + = "<tr><td align=\" Center\ "height=\" 22\ "colspan=\" 8\ "onmouseout=\" Parent.colordialogmouseout ( this); \ "Onmouseover=\" Parent.colOrdialogmouseover (this); \ "Style=\" border:1px solid;font-size:12px;cursor:default;\ "onmousedown=\" Parent.colordialogmore () \ "> Other color ...</td></tr>"; Ocbody = "</table>"; opopbody.innerhtml = Ocbody; Ocolorpopup.show (COLORDIALOGX, Colordialogy, COLORDIALOGW, Colordialogh, document.body); }//--> function Windowstextshow (divid) {if (!isrunning) {windowstextinit (divid); IsRunning = true; } setwindows (); function Setwindows () {textwindowtop = + Document.documentElement.scrollTop; Textwindowleft = 50; Div_back.style.display = ' block '; div_back.style.visibility = ' visible '; Div_box.style.display = ' block '; Div_box.classname = "Windowstextshow"; function Refreshwin () {textwindowtop = + Document.documentElement.scrollTop; Textwindowleft = 50; function Windowstextinit (divid) {var div_ctrlset = document.createelement ("div"); var div_textcontent = document.createelement ("div"); Div_ctrlset.id = "Ctrlset"; Div_textcontent.id = "TeXtcontent "; Div_box.id = "Windowstextshow"; Div_box.classname = "Windowstextshow"; Div_back.id = "Divback"; Windowstextaddobj (Div_box, div_textcontent); Windowstextaddobj (Div_box, Div_ctrlset); Setobjcontent (Div_textcontent, document.getElementById (divid). InnerHTML); Setobjcontent (Div_ctrlset, "<div id= ' typeset ' > select change items: <input checked= ' checked ' name= ' colortype ' type= '" Radio ') Value= ' TextColor '/> text <input name= ' colortype ' type= ' Radio ' value= ' ' textbackcolor ' the background/> ' <input ' ColorType ' type= ' Radio ' value= ' BackgroundColor '/> cover </div> '); Setobjcontent (Div_ctrlset, "<div id= ' colorset ' > Choose colors: <input id= ' setcolorbox ' name= ' sel1 ' type= ' text ') Onkeydown= ' Colorset () ' onfocus= ' ColorDialog () '/></div> '); Setobjcontent (Div_ctrlset, "<div id= ' fontsizeset ' > Font: <select name= ' select ' id= ' fontslt '" onchange= ') SetFont (textcontent) ' ><option selected> choose reading Font </option></select></div> '); Setobjcontent (Div_ctrlset, "<div id=' Fullscreenset ' > Full screen Toggle: <input type= ' button ' onclick= ' fullscreen () ' id= ' fullscreen ' name= ' fullscreen ' ' value= ' Fullscreen '/></div> '); Setobjcontent (Div_ctrlset, "<div id= ' Hiddenctrset ' > Hidden settings: <input type= ' button ' onclick= ' Hiddenctrlset ') ' Name= ' hiddenctrlset ' value= ' hiddenctrlset '/></div> '); Setobjcontent (Div_ctrlset, "<div id= ' closeset ' > Close window: <input type= ' button ' onclick= ' Closewindows" () ' name= ') Closewindows ' value= ' closewindows '/></div> '); Document.body.appendChild (Div_back); Document.body.appendChild (Div_box); Selectaddobj (); The function Hiddenctrlset () {if (isctrlsetshow) {document.getElementById ("typeset"). Style.display = "None"; document.getElementById ("Colorset"). Style.display = "None"; document.getElementById ("Fontsizeset"). Style.display = "None"; document.getElementById ("Fullscreenset"). Style.display = "None"; Isctrlsetshow = false; else {document.getElementById ("typeset"). Style.display = "block"; Document.getelemenTbyid ("Colorset"). Style.display = "block"; document.getElementById ("Fontsizeset"). Style.display = "block"; document.getElementById ("Fullscreenset"). Style.display = "block"; Isctrlsetshow = true; }} function fullscreen () {if (isfullscreen) {isfullscreen = false; Textwindowtop + 50; Textwindowleft + 50; Div_box.classname = "Windowstextshow"; document.getElementById ("fullscreen"). Value = "fullscreen"; else {IsFullScreen = true; Textwindowtop-= 50; Textwindowleft-= 50; Div_box.classname = "Windowstextshowfull"; document.getElementById ("fullscreen"). Value = "Defaultscreen"; } function Getieheight ()//function: Get dimension {var winheight = 0; if (window.innerheight) winheight = window.innerheight; else if ((document.body) && (document.body.clientHeight)) winheight = Document.body.clientHeight; if (document.documentelement && document.documentElement.clientHeight && Document.documentElement.clientWidth) {winheight = Document.documentelemenT.clientheight; return winheight; function Getradiovalue (IDs) {var obj = document.getelementsbyname (IDs); for (var i = 0; i < obj.length i++) {if (obj[i].checked) {return obj[i].value; }} function SetFont (Winid) {if (Fontslt.selectedindex!=-1) && (fontslt.selectedindex!= 0)) {winid.st Yle.fontsize = Fontslt.options[fontslt.selectedindex].value; } function Selectaddobj () {for (i = 9; i < i++) {var varitem = new Option (i + "pt font", i); document.getElementById ("Fontslt"). Options.add (Varitem); } function Setobjcontent (IDs, obj) {ids.innerhtml + = obj; function windowstextaddobj (IDs, obj) {ids.appendchild (obj); function Closewindows () {div_back.style.display = ' none '; Div_box.style.display = ' None '; Div_box.classname = "Windowstextshow"; div_back.style.visibility = ' hidden '; IsFullScreen = false; document.getElementById ("fullscreen"). Value = "fullscreen"; } </script> </pead> <body> <div > <div ></div> <div > <div > <div > "Running kart" domestic operators laid off more than 30% see text </div> <div Id= "TextBox" > Karting "flameout" online games winter meaning gradually increase this reporter Liu Fangyuan graduates Xiao Wang (alias) recently caught in the rush to find work.   Not long ago, he thought to join the so-called "anti-economic cycle" of the online games industry, can let him in this round of winter to protect himself. "Since the beginning of this month, the company began to cut staff, the number of successive batches of more than 100 people, accounting for the company's total numbers of 30% to 40%."   "Xiao Wang is Le Line software development (Shanghai) Co., Ltd. this year's new staff, the company is the Korean online game manufacturers Nexon in China's branch, under the" Run Kart "and other well-known network games. It is reported that "running kart" in the domestic leisure game has been ranked among the top, for operators to bring considerable revenue.   Because the net swims to the financial environment has the Haven effect, before, the domestic net swims the industry to have expressed the optimism to this profession, the music line software Why at this moment chooses the substantial "thin body"?   December 24, reporters on the matter to the Lok Shun software verification, le Line Software Management Center, a South Korean party responsible to reporters that the company is currently inconvenient to say.   Front adjustment? Le Letter Software's parent company Nexon in the domestic small has the fame, in the early Years Grand Network proxy leisure game "bubble Hall" is comes from the nexon hand.   See "Bubble Hall" in the Chinese market after the great success, Nexon then gave up with the grand cooperation, independent set up the Le Letter software operating in China, "running kart car" and other casual games. According to the online games industry insiders, "running kart" now operating platform known as the Century Tiancheng, by the Shanghai Post and Le Line software together to build, "the outside world known ' the ' Century Tiancheng ' practical control is the music line software."   "In addition to running kart" outside, the century-day operation of the game also has "Lodge", "New sky Wing Chain", "Days of War", "Counter-Strike online" and so on. "Rocky" is the first online game, but the reaction is flat, but since 2006 officially launched in the domestic "running kart" since the company began to turn.   A net swims industry personage tells a reporter, run a game of kart only, the maximum one months can bring nearly tens of millions of income, but the other game market performance of the century Tiancheng is still very general.   December 12, Century Tiancheng in the "Days of war" and "the New Day wing chain" the two online games official network also issued a "termination of the operation of the bulletin," said the two games all servers will be closed on December 30 10:00. In this respect, Xiao Wang told reporters, this may be the company to reduce the staff of the reason, because aSome old game performance decline, the company to transform, plus there are new games to be online, so to do large-scale adjustment. Another person familiar with the matter told reporters that the century-day personnel adjustment involves a large number of senior staff, "a lot of the first batch of" Rocky "," karting "people have gone, may be South Korea's economic crisis adjustment. "It is reported that" counter-Strike online "is a new game in the recent listing test," although this game in South Korea is not good, but because there are more than South Korea, the basis of the CS player, so the game was their high hopes.   "Online games have no winter?"   In fact, some world-class game giants have also begun to "slim down".   Starting in December, EA, a well-known US game developer, announced that the company would lay off another 400 people, plus a October layoff plan, which would amount to 1000 layoffs, accounting for about 10% of the total number of employees.   However, industry experts believe that, because EA is still relying on traditional stand-alone game mode, and facing the western mature market, so affected by the economic environment, and China's online gaming market is still in the growth phase, so the impact is small.   In this regard, Shanda, Giants, the Nineth city and other aspects of the reporter expressed a similar view-the net is cheap entertainment, the economic crisis caused by the decline in the short term is unlikely to affect low consumption of entertainment, so did not see a sharp contraction in the market. "To already listed big net swims the enterprise, this round economic situation brings the influence is not big, one is because the product already more mature, the second is to have sufficient fund."   Chen Xiaowei, the Nineth city president, told reporters that the focus of the nine city is to implement a diversified product strategy to improve the risk of decentralized reliance on a single product line for different needs.   China's online gaming operators grew more than 50% per cent in the third quarter of this year, to nearly $800 million trillion, according to market research company Eric Consulting, while growth in the online gaming market continued to be strong this quarter. However, for not listed small and medium-sized online games manufacturers, the day really began to become sad, because the small studio is difficult to get the investment, further research and development into the Duanliang, the future of small studios will be unsustainable. The head of a medium-sized online gaming company told reporters, "recently some big expansion plans have been stranded, can only rely on existing games to maintain the status quo." "</div> </div> <div ></div> </div> <div ></div> </div> &LT;/BODY&G T </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]

Like the blue Ideal home article can be used completely, quite practical.
We can try, now only support IE I do under the IE7, interested in their own can do CSS hack, so that he supports more browsers.
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.