집 > 기사 > 웹 프론트엔드 > JS CSS 기사 보기 system_javascript 기술

JS CSS 기사 보기 system_javascript 기술

WBOY원래의: 2016-05-16 18:56:571206검색

연결하기: 클릭 후 JavaScript 함수를 실행합니다.
함수: WindowsTextShow(Id div.id)
div.id는 텍스트를 표시할 div의 ID입니다.
코드는 다음과 같습니다.

<title>제목 없는 페이지</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>

<div style=" width:900px; height:1400px; background-color:Gray; margin:0 auto;">
<div style=" height:100px; background-color:Red;">
</div>
<div style=" height:1200px; background-color:Black;">
<div style="width:75%; float:left;">
<div style="height:100px; background-color:Blue;">
<a href="javascript:WindowsTextShow('textBox')">
'카트레이싱' 국내 운영자, 직원 30% 이상 해고
</a>텍스트 보기</div>
<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 = 50 + 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(); 
} 
function colorset() { 
if (window.event.keyCode == 13) { 
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(); 
} 
} 
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:1px solid #808080;\" width=\"12\" height=\"12\" bgcolor=\"" + e.value + "\"><tr><td><td bgcolor=\"eeeeee\" colspan=\"7\" style=\"font-size:12px;\" align=\"center\">当前颜色"; 
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>"; 
if (i % 8 == 7) 
ocbody += ""; 
} 
//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()\">其它颜色..."; 
ocbody += ""; 
oPopBody.innerHTML = ocbody; 
ocolorPopup.show(colordialogx, colordialogy, colordialogw, colordialogh, document.body); 
} 
//--> 
function WindowsTextShow(divid) { 
if (!isRunning) { 
WindowsTextInit(divid); 
isRunning = true; 
} 
SetWindows(); 
} 
function SetWindows() { 
textwindowtop = 50 + 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 = 50 + 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'>选择更改项：<input checked='checked' name='colorType' type='radio' value='textColor' />文字<input name='colorType' type='radio' value='textbackColor' />背景<input name='colorType' type='radio' value='backGroundColor' />遮盖物</script>
</div>"); 
SetObjContent(div_ctrlSet, "<div id="colorSet">选择颜色：<input id="setcolorbox" name="sel1" type="text" onkeydown="colorset()" onfocus="colordialog()">
</div>"); 
SetObjContent(div_ctrlSet, "<div id="fontSizeSet">选择字体：<select name="select" id="fontslt" onchange="SetFont(textContent)"><option selected>选择阅读字体</option></select>
</div>"); 
SetObjContent(div_ctrlSet, "<div id="fullScreenSet">全屏切换：<input type="button" onclick="FullScreen()" id="fullScreen" name="fullScreen" value="FullScreen">
</div>"); 
SetObjContent(div_ctrlSet, "<div id="hiddenCtrSet">隐藏设置：<input type="button" onclick="HiddenCtrlSet()" name="HiddenCtrlSet" value="HiddenCtrlSet">
</div>"); 
SetObjContent(div_ctrlSet, "<div id="closeSet">关闭窗口：<input type="button" onclick="CloseWindows()" name="CloseWindows" value="CloseWindows">
</div>"); 
document.body.appendChild(div_back); 
document.body.appendChild(div_box); 
SelectAddObj(); 
} 
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() //函数：获取尺寸 
{ 
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 <div id="textBox" style="height:1100px; background-color:White;">
고카트 노점상, 온라인 게임은 더욱 겨울스러워진다
류팡위안 기자
졸업생 샤오왕(가명) 씨는 최근 취업난에 휩싸였다. 얼마 전까지만 해도 그는 '반경제적 악순환'으로 알려진 온라인 게임 산업에 뛰어들면 이 추운 겨울에도 자신을 지킬 수 있을 거라 생각했다. 
"회사는 이달 초부터 직원을 해고하기 시작했는데, 여러 차례에 걸쳐 총 100명 이상이었는데, 이는 회사 전체 직원 수의 30~40%를 차지합니다." 올해 Lexian Software Development (Shanghai) Co., Ltd.는 한국 온라인 게임 제조업체인 Nexon의 중국 지사입니다. 이 회사는 "Kart Run"과 같은 유명 온라인 게임을 소유하고 있습니다. 
'카트러너'는 국내 캐주얼 게임 분야에서 줄곧 상위권을 유지하며 운영자에게 상당한 수익을 안겨준 것으로 알려졌다. 온라인 게임은 금융 환경에 안전한 피난처 영향을 미치기 때문에 국내 온라인 게임 제조업체들은 이전부터 업계에 대해 낙관적인 입장을 밝혔습니다. 왜 지금 렉시안 소프트웨어는 대폭적인 규모 축소를 선택했을까요? 
지난 12월 24일, 기자는 르신 소프트웨어에 이 문제에 대한 확인을 요청했습니다. 르신 소프트웨어 관리센터의 한국 담당자는 회사가 현재 이 문제에 대해 언급할 수 없다고 기자에게 말했습니다. 
전선 조정? 
렉신소프트웨어의 모회사인 넥슨은 초창기 샨다네트워크가 유통한 캐주얼 게임 '버블홀'을 넥슨이 제작했다. 넥슨은 '파오파오탕'이 중국 시장에서 큰 성공을 거둔 뒤 샨다와의 협력을 접고 독자적으로 렉신 소프트웨어를 설립해 '카트러너' 등 캐주얼 게임을 중국에서 운영하고 있다. 
온라인 게임 업계 관계자에 따르면 현재 '카트 레이싱'의 운영 플랫폼은 상하이 포스트와 렉시안 소프트웨어가 공동으로 구축한 센츄리 티안청(Century Tiancheng)이다. Lexian Software." Century Tiancheng에서 운영하는 게임으로는 "Kart Racing" 외에도 "Rocky", "New Tianyi Chain", "Tianguan War", "Counter-Strike Online" 등이 있습니다. 
'라키'는 중국에서 처음 출시된 게임이었지만 반응은 미미했다. 하지만 2006년 '카트레이싱'이 중국에 정식 출시된 이후 회사는 반전을 거듭하기 시작했다. 온라인 게임 업계의 한 관계자는 기자들에게 Kart Racing만으로도 한 달에 거의 천만 위안에 달하는 수익을 올릴 수 있다고 말했습니다. 그러나 Century Tiancheng의 다른 게임의 시장 성과는 여전히 평균 수준입니다. 
12월 12일, Century Tiancheng은 두 온라인 게임 'Tianguan War Chronicles'와 'New Tianyi Chain'의 공식 웹사이트에 동시에 '운영 종료 안내'를 발표하고 두 게임의 모든 서버를 폐쇄할 예정이라고 밝혔습니다. 12월 30일 일요일 10:00에 문을 닫습니다. 
이와 관련하여 Xiao Wang은 이것이 회사가 일부 오래된 게임의 성능이 저하되었기 때문에 회사가 변화해야 하고 출시할 새로운 게임이 있기 때문에 이것이 직원을 줄이는 이유일 수 있다고 기자들에게 말했습니다. 대규모 조정이 이루어져야 합니다. 
이 문제에 정통한 또 다른 관계자는 기자들에게 이번 센추리천성 인사 조정에는 '록키'와 '카트'를 작업했던 1차 인력 중 상당수가 떠났을 수도 있다고 말했다. 경제위기로 인한 한국의 조정 때문이다”라고 말했다.
'카운터스트라이크온라인'은 최근 센추리텐청이 출시해 테스트 중인 신작 게임으로 알려졌다. 그들은 큰 희망을 가지고 있습니다."
온라인 게임에도 겨울이 있나요? 
실제로 일부 국제 게임 대기업도 "규모 축소"를 시작했습니다. 
미국의 유명 게임 개발사인 EA(Electronic Arts)가 12월부터 400명을 추가로 해고하겠다고 발표했다. 10월 정리해고 계획으로 정리해고 인원은 전체 직원의 약 10%에 달하는 1000명에 달한다. 총 직원 수. 
그러나 업계 전문가들은 EA가 여전히 전통적인 독립형 게임 모델에 의존하고 성숙한 서구 시장에 직면해 있기 때문에 중국 온라인 게임 시장은 아직 성장 단계에 있기 때문에 경제 환경에 큰 영향을 받고 있다고 보고 있다. 경제 환경의 영향은 더 작습니다. 
이에 대해 샨다(Shanda), 자이언트(Giant), 디나인(The9) 등도 기자들에게 비슷한 견해를 표명했다. 온라인 게임은 값싼 엔터테인먼트이고, 경제위기로 인한 소득 감소가 단기적으로 저소비 엔터테인먼트 프로젝트에 영향을 미칠 가능성은 낮다. 그들은 시장이 크게 줄어든 것을 본 적이 없습니다. 
"상장된 대형 온라인 게임 회사의 경우 이번 경제 상황의 영향은 크지 않습니다. 첫째, 제품이 상대적으로 성숙하고 둘째, 자금이 충분하기 때문입니다." 현재 The9의 초점은 다양한 제품 전략을 구현하고 다양한 요구에 맞는 단일 제품 라인에 대한 의존도를 다양화하는 위험을 개선하는 것입니다. 
시장조사업체 아이리서치(iResearch)에 따르면 올해 3분기 중국 온라인 게임 사업자 전체 매출은 전년 동기 대비 50% 이상 증가해 약 8억달러에 달했다. 이번 분기 온라인 게임 시장은 여전히 매우 강세를 보이고 있습니다. 
하지만 아직 시장에 상장되지 않은 중소 온라인 게임 제조사들의 경우, 더 이상의 R&D 투자가 중단된 이후에는 영세 스튜디오의 투자 유치가 어려워 사실상 생활이 어려워지기 시작했습니다. 소규모 스튜디오는 지속 가능하지 않습니다. 한 중견 온라인 게임업체 관계자는 기자들에게 "최근 몇몇 주요 확장 계획이 일시적으로 보류됐고, 현 상태를 유지하려면 기존 게임에만 의존할 수밖에 없다"고 말했다.
</div>
</div>
<div style="width:25%; float:left;"></div>
</div>
<div style=" height:100px; background-color:Red;"></div>

[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다 ]
좋아요 블루이상 홈페이지 이 글을 활용하시면 아주 실용적입니다.
이제는 IE만 지원합니다. 관심이 있으시면 CSS 해킹을 통해 더 많은 브라우저를 지원하실 수 있습니다.

성명：

이전 기사：javascript 함수 code_form 특수 효과를 편집하려면 텍스트 상자를 두 번 클릭하세요.다음 기사：javascript 함수 code_form 특수 효과를 편집하려면 텍스트 상자를 두 번 클릭하세요.

JS CSS 기사 보기 system_javascript 기술

관련 기사